blend-native 0.0.1-beta.0

package/lib/module/overlay/sheet/BottomSheet.js

@@ -0,0 +1,190 @@
+"use strict";
+
+import React, { useCallback, useContext, useEffect, useState } from 'react';
+import { BackHandler, Pressable, StyleSheet, useWindowDimensions, View } from 'react-native';
+import Animated, { Easing, runOnJS, useAnimatedStyle, useSharedValue, withSpring, withTiming } from 'react-native-reanimated';
+import { Gesture, GestureDetector } from 'react-native-gesture-handler';
+import { Portal } from "../portal.js";
+import { SafeAreaInsetsContext } from "../safeAreaInsets.js";
+import { MOTION_DURATION, MOTION_EASING } from "../../motion/motion.js";
+import { useReduceMotion } from "../../motion/useReduceMotion.js";
+import { clampSheetDrag, resolveSheetMaxHeight, shouldDismissSheet, SHEET_MAX_HEIGHT_FRACTION } from "./sheetMath.js";
+
+/**
+ * BottomSheet — the gesture-driven sheet foundation.
+ *
+ * The native replacement for `vaul` and the phone presentation web already
+ * prescribes in its Mobile* variants (mobileModalV2, MobileSingleSelectV2,
+ * MobilePopoverV2): DrawerV2 and the phone modes of Select/Menu/Modal
+ * compose this primitive and pass their token values in — the sheet itself
+ * carries structure and physics, not design decisions, which is why its
+ * colour props have plain defaults instead of token lookups.
+ *
+ * Controlled: `open` drives it; every dismiss route (drag, backdrop, the
+ * Android back button) calls `onClose` and the owner flips `open` — the
+ * exit animation runs, then the sheet unmounts from the portal layer.
+ *
+ * Requirements: `react-native-reanimated` and `react-native-gesture-handler`
+ * (required peers), and a `GestureHandlerRootView` at the app root — apps
+ * using react-navigation already have one. `react-native-safe-area-context`
+ * is optional: with it (and its provider) mounted, the sheet pads itself
+ * past the home indicator; without it the bottom inset is 0.
+ *
+ * Reduce-motion: the slide collapses to a fade (`useReduceMotion`).
+ */
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const ENTER = {
+  duration: MOTION_DURATION.slow,
+  easing: Easing.bezier(...MOTION_EASING.decelerate)
+};
+const EXIT = {
+  duration: MOTION_DURATION.normal,
+  easing: Easing.bezier(...MOTION_EASING.accelerate)
+};
+export function BottomSheet({
+  open,
+  onClose,
+  children,
+  maxHeightFraction = SHEET_MAX_HEIGHT_FRACTION,
+  backdropColor = 'rgba(0, 0, 0, 0.5)',
+  backgroundColor = '#FFFFFF',
+  topRadius = 16,
+  showHandle = true,
+  handleColor = 'rgba(0, 0, 0, 0.2)',
+  dragToDismiss = true,
+  dismissOnBackdropPress = true,
+  accessibilityLabel,
+  testID,
+  style
+}) {
+  // Mounted outlives `open` by one exit animation.
+  const [mounted, setMounted] = useState(open);
+  const progress = useSharedValue(0);
+  const dragY = useSharedValue(0);
+  const sheetHeight = useSharedValue(0);
+  const window = useWindowDimensions();
+  const insets = useContext(SafeAreaInsetsContext);
+  const reduceMotion = useReduceMotion();
+  const unmount = useCallback(() => setMounted(false), []);
+  useEffect(() => {
+    if (open) {
+      setMounted(true);
+      progress.value = withTiming(1, ENTER);
+    } else {
+      // Drag offset folds into the exit so a gesture-dismissed sheet
+      // continues downward from wherever the finger left it.
+      dragY.value = withTiming(0, EXIT);
+      progress.value = withTiming(0, EXIT, finished => {
+        if (finished) runOnJS(unmount)();
+      });
+    }
+  }, [open, progress, dragY, unmount]);
+
+  // Android hardware back closes the sheet instead of the screen.
+  useEffect(() => {
+    if (!open) return;
+    const subscription = BackHandler.addEventListener('hardwareBackPress', () => {
+      onClose();
+      return true;
+    });
+    return () => subscription.remove();
+  }, [open, onClose]);
+  const onSheetLayout = useCallback(event => {
+    sheetHeight.value = event.nativeEvent.layout.height;
+  }, [sheetHeight]);
+  const pan = Gesture.Pan().enabled(dragToDismiss).onChange(event => {
+    dragY.value = clampSheetDrag(event.translationY);
+  }).onEnd(event => {
+    if (shouldDismissSheet(event.translationY, event.velocityY, sheetHeight.value)) {
+      runOnJS(onClose)();
+    } else {
+      dragY.value = withSpring(0, {
+        damping: 22,
+        stiffness: 320
+      });
+    }
+  });
+  const windowHeight = window.height;
+  const sheetStyle = useAnimatedStyle(() => {
+    if (reduceMotion) {
+      return {
+        opacity: progress.value,
+        transform: [{
+          translateY: dragY.value
+        }]
+      };
+    }
+    // Until the first layout lands, the full window height keeps the
+    // sheet parked off-screen instead of flashing in place.
+    const height = sheetHeight.value || windowHeight;
+    return {
+      opacity: 1,
+      transform: [{
+        translateY: (1 - progress.value) * height + dragY.value
+      }]
+    };
+  }, [reduceMotion, windowHeight]);
+  const backdropStyle = useAnimatedStyle(() => ({
+    opacity: progress.value
+  }));
+  if (!mounted) return null;
+  const maxHeight = resolveSheetMaxHeight(windowHeight, insets?.top ?? 0, maxHeightFraction);
+  return /*#__PURE__*/_jsxs(Portal, {
+    children: [/*#__PURE__*/_jsx(Animated.View, {
+      style: [StyleSheet.absoluteFill, {
+        backgroundColor: backdropColor
+      }, backdropStyle],
+      testID: testID ? `${testID}-backdrop` : undefined
+      // The sheet is the modal surface; VoiceOver skips the
+      // backdrop (it could not reach it past
+      // accessibilityViewIsModal anyway).
+      ,
+      accessible: false,
+      importantForAccessibility: "no-hide-descendants",
+      children: /*#__PURE__*/_jsx(Pressable, {
+        style: StyleSheet.absoluteFill,
+        onPress: dismissOnBackdropPress ? onClose : undefined
+      })
+    }), /*#__PURE__*/_jsx(GestureDetector, {
+      gesture: pan,
+      children: /*#__PURE__*/_jsxs(Animated.View, {
+        onLayout: onSheetLayout,
+        accessibilityViewIsModal: true,
+        accessibilityLabel: accessibilityLabel,
+        testID: testID,
+        style: [styles.sheet, {
+          maxHeight,
+          backgroundColor,
+          borderTopLeftRadius: topRadius,
+          borderTopRightRadius: topRadius,
+          paddingBottom: insets?.bottom ?? 0
+        }, sheetStyle, style],
+        children: [showHandle ? /*#__PURE__*/_jsx(View, {
+          style: [styles.handle, {
+            backgroundColor: handleColor
+          }]
+        }) : null, children]
+      })
+    })]
+  });
+}
+BottomSheet.displayName = 'BottomSheet';
+const styles = StyleSheet.create({
+  sheet: {
+    position: 'absolute',
+    left: 0,
+    right: 0,
+    bottom: 0,
+    overflow: 'hidden'
+  },
+  handle: {
+    alignSelf: 'center',
+    width: 36,
+    height: 4,
+    borderRadius: 2,
+    marginTop: 8,
+    marginBottom: 4
+  }
+});
+export default BottomSheet;
+//# sourceMappingURL=BottomSheet.js.map

package/lib/module/overlay/sheet/BottomSheet.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useCallback","useContext","useEffect","useState","BackHandler","Pressable","StyleSheet","useWindowDimensions","View","Animated","Easing","runOnJS","useAnimatedStyle","useSharedValue","withSpring","withTiming","Gesture","GestureDetector","Portal","SafeAreaInsetsContext","MOTION_DURATION","MOTION_EASING","useReduceMotion","clampSheetDrag","resolveSheetMaxHeight","shouldDismissSheet","SHEET_MAX_HEIGHT_FRACTION","jsx","_jsx","jsxs","_jsxs","ENTER","duration","slow","easing","bezier","decelerate","EXIT","normal","accelerate","BottomSheet","open","onClose","children","maxHeightFraction","backdropColor","backgroundColor","topRadius","showHandle","handleColor","dragToDismiss","dismissOnBackdropPress","accessibilityLabel","testID","style","mounted","setMounted","progress","dragY","sheetHeight","window","insets","reduceMotion","unmount","value","finished","subscription","addEventListener","remove","onSheetLayout","event","nativeEvent","layout","height","pan","Pan","enabled","onChange","translationY","onEnd","velocityY","damping","stiffness","windowHeight","sheetStyle","opacity","transform","translateY","backdropStyle","maxHeight","top","absoluteFill","undefined","accessible","importantForAccessibility","onPress","gesture","onLayout","accessibilityViewIsModal","styles","sheet","borderTopLeftRadius","borderTopRightRadius","paddingBottom","bottom","handle","displayName","create","position","left","right","overflow","alignSelf","width","borderRadius","marginTop","marginBottom"],"sourceRoot":"../../../../src","sources":["overlay/sheet/BottomSheet.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/overlay/sheet/sheetMath.js

@@ -0,0 +1,53 @@
+"use strict";
+
+/**
+ * Bottom-sheet gesture arithmetic.
+ *
+ * Pure and RN-free (the `theme/breakpoint.ts` pattern) so the dismiss
+ * decision — the part of a sheet that feels wrong when it is wrong — is
+ * unit-testable under vitest. `BottomSheet` wires these into the pan
+ * gesture; they also run as Reanimated worklets, so nothing here may close
+ * over module state.
+ */
+
+/** Dragging past this fraction of the sheet's height dismisses on release. */
+export const SHEET_DISMISS_FRACTION = 0.25;
+
+/** A downward fling at or above this velocity (pt/s) dismisses regardless. */
+export const SHEET_DISMISS_VELOCITY = 800;
+
+/** Default cap: a sheet covers at most this fraction of the window. */
+export const SHEET_MAX_HEIGHT_FRACTION = 0.9;
+
+/**
+ * The sheet follows the finger downward only — upward drag is pinned so the
+ * sheet feels anchored rather than lifting off its resting position.
+ */
+export function clampSheetDrag(translationY) {
+  'worklet';
+
+  return Math.max(0, translationY);
+}
+
+/**
+ * Whether a released drag should dismiss the sheet: past the distance
+ * threshold, or a genuine downward fling. An upward fling never dismisses,
+ * whatever distance was covered first.
+ */
+export function shouldDismissSheet(translationY, velocityY, sheetHeight) {
+  'worklet';
+
+  if (velocityY <= -SHEET_DISMISS_VELOCITY) return false;
+  if (velocityY >= SHEET_DISMISS_VELOCITY) return translationY > 0;
+  return sheetHeight > 0 && translationY >= sheetHeight * SHEET_DISMISS_FRACTION;
+}
+
+/**
+ * The tallest a sheet may grow: the capped fraction of the window, minus
+ * whatever top inset (status bar / notch) must stay visible above it.
+ */
+export function resolveSheetMaxHeight(windowHeight, topInset = 0, maxHeightFraction = SHEET_MAX_HEIGHT_FRACTION) {
+  const capped = windowHeight * maxHeightFraction;
+  return Math.max(0, Math.min(capped, windowHeight - topInset));
+}
+//# sourceMappingURL=sheetMath.js.map

package/lib/module/overlay/sheet/sheetMath.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["SHEET_DISMISS_FRACTION","SHEET_DISMISS_VELOCITY","SHEET_MAX_HEIGHT_FRACTION","clampSheetDrag","translationY","Math","max","shouldDismissSheet","velocityY","sheetHeight","resolveSheetMaxHeight","windowHeight","topInset","maxHeightFraction","capped","min"],"sourceRoot":"../../../../src","sources":["overlay/sheet/sheetMath.ts"],"mappings":";;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA,OAAO,MAAMA,sBAAsB,GAAG,IAAI;;AAE1C;AACA,OAAO,MAAMC,sBAAsB,GAAG,GAAG;;AAEzC;AACA,OAAO,MAAMC,yBAAyB,GAAG,GAAG;;AAE5C;AACA;AACA;AACA;AACA,OAAO,SAASC,cAAcA,CAACC,YAAoB,EAAU;EACzD,SAAS;;EACT,OAAOC,IAAI,CAACC,GAAG,CAAC,CAAC,EAAEF,YAAY,CAAC;AACpC;;AAEA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASG,kBAAkBA,CAC9BH,YAAoB,EACpBI,SAAiB,EACjBC,WAAmB,EACZ;EACP,SAAS;;EACT,IAAID,SAAS,IAAI,CAACP,sBAAsB,EAAE,OAAO,KAAK;EACtD,IAAIO,SAAS,IAAIP,sBAAsB,EAAE,OAAOG,YAAY,GAAG,CAAC;EAChE,OACIK,WAAW,GAAG,CAAC,IAAIL,YAAY,IAAIK,WAAW,GAAGT,sBAAsB;AAE/E;;AAEA;AACA;AACA;AACA;AACA,OAAO,SAASU,qBAAqBA,CACjCC,YAAoB,EACpBC,QAAgB,GAAG,CAAC,EACpBC,iBAAyB,GAAGX,yBAAyB,EAC/C;EACN,MAAMY,MAAM,GAAGH,YAAY,GAAGE,iBAAiB;EAC/C,OAAOR,IAAI,CAACC,GAAG,CAAC,CAAC,EAAED,IAAI,CAACU,GAAG,CAACD,MAAM,EAAEH,YAAY,GAAGC,QAAQ,CAAC,CAAC;AACjE","ignoreList":[]}

package/lib/module/overlay/toast/ToastOutlet.js

@@ -0,0 +1,101 @@
+"use strict";
+
+import { useCallback, useContext, useEffect, useSyncExternalStore } from 'react';
+import { StyleSheet, View } from 'react-native';
+import Animated, { Easing, useAnimatedStyle, useSharedValue, withTiming } from 'react-native-reanimated';
+import { Portal } from "../portal.js";
+import { SafeAreaInsetsContext } from "../safeAreaInsets.js";
+import { MOTION_DURATION, MOTION_EASING, MOTION_PRESETS } from "../../motion/motion.js";
+import { useReduceMotion } from "../../motion/useReduceMotion.js";
+import { useLiveRegionAnnounce } from "../../a11y/useLiveRegion.js";
+import { dismissToast, getToasts, getVisibleToasts, subscribeToasts } from "./toastStore.js";
+
+/**
+ * The toast rendering surface, mounted once by `BlendNativeProvider`.
+ *
+ * Subscribes to the store and renders the newest `MAX_VISIBLE_TOASTS`
+ * bottom-stacked above everything through a `Portal`. Each toast slides up
+ * on entry (a fade under reduce-motion), owns its auto-dismiss timer, and
+ * announces itself to assistive tech when asked.
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+export function ToastOutlet() {
+  const toasts = useSyncExternalStore(subscribeToasts, getToasts, getToasts);
+  const insets = useContext(SafeAreaInsetsContext);
+  const visible = getVisibleToasts(toasts);
+  if (visible.length === 0) return null;
+  return /*#__PURE__*/_jsx(Portal, {
+    children: /*#__PURE__*/_jsx(View, {
+      style: [styles.stack, {
+        paddingBottom: (insets?.bottom ?? 0) + 16
+      }],
+      pointerEvents: "box-none",
+      testID: "blend-toast-outlet",
+      children: visible.map(toast => /*#__PURE__*/_jsx(ToastItem, {
+        toast: toast
+      }, toast.id))
+    })
+  });
+}
+ToastOutlet.displayName = 'ToastOutlet';
+function ToastItem({
+  toast
+}) {
+  const reduceMotion = useReduceMotion();
+  const progress = useSharedValue(0);
+  const dismiss = useCallback(() => dismissToast(toast.id), [toast.id]);
+
+  // Enter animation once per toast id.
+  useEffect(() => {
+    progress.value = withTiming(1, {
+      duration: MOTION_PRESETS.slideUp.duration,
+      easing: Easing.bezier(...MOTION_EASING.decelerate)
+    });
+  }, [progress]);
+
+  // Auto-dismiss owns its timer; content replacement (same id) restarts it.
+  useEffect(() => {
+    if (toast.duration === null) return;
+    const timer = setTimeout(dismiss, toast.duration);
+    return () => clearTimeout(timer);
+  }, [toast.id, toast.duration, toast.content, dismiss]);
+  useLiveRegionAnnounce(toast.announcement, Boolean(toast.announcement));
+  const animatedStyle = useAnimatedStyle(() => {
+    if (reduceMotion) {
+      return {
+        opacity: progress.value,
+        transform: [{
+          translateY: 0
+        }]
+      };
+    }
+    return {
+      opacity: progress.value,
+      transform: [{
+        translateY: (1 - progress.value) * (MOTION_PRESETS.slideUp.from.translateY ?? 16)
+      }]
+    };
+  }, [reduceMotion]);
+  return /*#__PURE__*/_jsx(Animated.View, {
+    style: animatedStyle,
+    accessibilityLiveRegion: toast.announcement ? 'polite' : 'none',
+    children: typeof toast.content === 'function' ? toast.content(dismiss) : toast.content
+  });
+}
+
+/** Exit duration is not modelled yet — dismissal unmounts immediately;
+ * SnackbarV2 will own richer exit choreography when it lands. Kept simple
+ * so the host stays predictable under the synchronous test mock. */
+export const TOAST_EXIT_DURATION = MOTION_DURATION.fast;
+const styles = StyleSheet.create({
+  stack: {
+    position: 'absolute',
+    left: 0,
+    right: 0,
+    bottom: 0,
+    alignItems: 'center',
+    gap: 8,
+    paddingHorizontal: 16
+  }
+});
+//# sourceMappingURL=ToastOutlet.js.map

package/lib/module/overlay/toast/ToastOutlet.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useCallback","useContext","useEffect","useSyncExternalStore","StyleSheet","View","Animated","Easing","useAnimatedStyle","useSharedValue","withTiming","Portal","SafeAreaInsetsContext","MOTION_DURATION","MOTION_EASING","MOTION_PRESETS","useReduceMotion","useLiveRegionAnnounce","dismissToast","getToasts","getVisibleToasts","subscribeToasts","jsx","_jsx","ToastOutlet","toasts","insets","visible","length","children","style","styles","stack","paddingBottom","bottom","pointerEvents","testID","map","toast","ToastItem","id","displayName","reduceMotion","progress","dismiss","value","duration","slideUp","easing","bezier","decelerate","timer","setTimeout","clearTimeout","content","announcement","Boolean","animatedStyle","opacity","transform","translateY","from","accessibilityLiveRegion","TOAST_EXIT_DURATION","fast","create","position","left","right","alignItems","gap","paddingHorizontal"],"sourceRoot":"../../../../src","sources":["overlay/toast/ToastOutlet.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/overlay/toast/toastStore.js

@@ -0,0 +1,66 @@
+"use strict";
+
+/**
+ * Toast queue — the sonner role, minus the styling.
+ *
+ * A module-level store with an imperative `showToast`/`dismissToast` API,
+ * so any code (not just components) can raise a toast; the outlet the
+ * provider mounts subscribes and renders. SnackbarV2 will layer its token
+ * styling on top of this host; the host itself owns only queueing,
+ * stacking, timing, and announcements.
+ *
+ * RN-free (a `React.ReactNode` type is the only React surface) so queue
+ * semantics unit-test under vitest.
+ */
+
+/** How many toasts render at once; older ones wait in the queue. */
+export const MAX_VISIBLE_TOASTS = 3;
+
+/** Default auto-dismiss delay, matching sonner's. */
+export const DEFAULT_TOAST_DURATION = 4000;
+let toasts = [];
+const listeners = new Set();
+let counter = 0;
+function emit() {
+  for (const listener of listeners) listener(toasts);
+}
+
+/** Raise a toast; returns its id. */
+export function showToast(options) {
+  const id = options.id ?? `blend-toast-${++counter}`;
+  const entry = {
+    id,
+    content: options.content,
+    duration: options.duration === null ? null : options.duration ?? DEFAULT_TOAST_DURATION,
+    announcement: options.announcement
+  };
+  const existing = toasts.findIndex(t => t.id === id);
+  toasts = existing === -1 ? [...toasts, entry] : toasts.map((t, i) => i === existing ? entry : t);
+  emit();
+  return id;
+}
+
+/** Dismiss one toast, or every toast when no id is given. */
+export function dismissToast(id) {
+  toasts = id === undefined ? [] : toasts.filter(t => t.id !== id);
+  emit();
+}
+export function getToasts() {
+  return toasts;
+}
+
+/** The slice the outlet renders: the newest MAX_VISIBLE. */
+export function getVisibleToasts(all = toasts) {
+  return all.slice(-MAX_VISIBLE_TOASTS);
+}
+export function subscribeToasts(listener) {
+  listeners.add(listener);
+  return () => listeners.delete(listener);
+}
+
+/** Test hook — clears the queue without notifying. */
+export function resetToasts() {
+  toasts = [];
+  counter = 0;
+}
+//# sourceMappingURL=toastStore.js.map

package/lib/module/overlay/toast/toastStore.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["MAX_VISIBLE_TOASTS","DEFAULT_TOAST_DURATION","toasts","listeners","Set","counter","emit","listener","showToast","options","id","entry","content","duration","announcement","existing","findIndex","t","map","i","dismissToast","undefined","filter","getToasts","getVisibleToasts","all","slice","subscribeToasts","add","delete","resetToasts"],"sourceRoot":"../../../../src","sources":["overlay/toast/toastStore.ts"],"mappings":";;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAmBA;AACA,OAAO,MAAMA,kBAAkB,GAAG,CAAC;;AAEnC;AACA,OAAO,MAAMC,sBAAsB,GAAG,IAAI;AAI1C,IAAIC,MAAoB,GAAG,EAAE;AAC7B,MAAMC,SAAS,GAAG,IAAIC,GAAG,CAAW,CAAC;AACrC,IAAIC,OAAO,GAAG,CAAC;AAEf,SAASC,IAAIA,CAAA,EAAG;EACZ,KAAK,MAAMC,QAAQ,IAAIJ,SAAS,EAAEI,QAAQ,CAACL,MAAM,CAAC;AACtD;;AAEA;AACA,OAAO,SAASM,SAASA,CAACC,OAAqB,EAAU;EACrD,MAAMC,EAAE,GAAGD,OAAO,CAACC,EAAE,IAAI,eAAe,EAAEL,OAAO,EAAE;EACnD,MAAMM,KAAiB,GAAG;IACtBD,EAAE;IACFE,OAAO,EAAEH,OAAO,CAACG,OAAO;IACxBC,QAAQ,EACJJ,OAAO,CAACI,QAAQ,KAAK,IAAI,GACnB,IAAI,GACHJ,OAAO,CAACI,QAAQ,IAAIZ,sBAAuB;IACtDa,YAAY,EAAEL,OAAO,CAACK;EAC1B,CAAC;EACD,MAAMC,QAAQ,GAAGb,MAAM,CAACc,SAAS,CAAEC,CAAC,IAAKA,CAAC,CAACP,EAAE,KAAKA,EAAE,CAAC;EACrDR,MAAM,GACFa,QAAQ,KAAK,CAAC,CAAC,GACT,CAAC,GAAGb,MAAM,EAAES,KAAK,CAAC,GAClBT,MAAM,CAACgB,GAAG,CAAC,CAACD,CAAC,EAAEE,CAAC,KAAMA,CAAC,KAAKJ,QAAQ,GAAGJ,KAAK,GAAGM,CAAE,CAAC;EAC5DX,IAAI,CAAC,CAAC;EACN,OAAOI,EAAE;AACb;;AAEA;AACA,OAAO,SAASU,YAAYA,CAACV,EAAW,EAAQ;EAC5CR,MAAM,GAAGQ,EAAE,KAAKW,SAAS,GAAG,EAAE,GAAGnB,MAAM,CAACoB,MAAM,CAAEL,CAAC,IAAKA,CAAC,CAACP,EAAE,KAAKA,EAAE,CAAC;EAClEJ,IAAI,CAAC,CAAC;AACV;AAEA,OAAO,SAASiB,SAASA,CAAA,EAA0B;EAC/C,OAAOrB,MAAM;AACjB;;AAEA;AACA,OAAO,SAASsB,gBAAgBA,CAC5BC,GAA0B,GAAGvB,MAAM,EACd;EACrB,OAAOuB,GAAG,CAACC,KAAK,CAAC,CAAC1B,kBAAkB,CAAC;AACzC;AAEA,OAAO,SAAS2B,eAAeA,CAACpB,QAAkB,EAAc;EAC5DJ,SAAS,CAACyB,GAAG,CAACrB,QAAQ,CAAC;EACvB,OAAO,MAAMJ,SAAS,CAAC0B,MAAM,CAACtB,QAAQ,CAAC;AAC3C;;AAEA;AACA,OAAO,SAASuB,WAAWA,CAAA,EAAS;EAChC5B,MAAM,GAAG,EAAE;EACXG,OAAO,GAAG,CAAC;AACf","ignoreList":[]}

package/lib/module/overlay/useAnchoredPosition.js

@@ -0,0 +1,82 @@
+"use strict";
+
+import { useCallback, useMemo, useRef, useState } from 'react';
+import { useWindowDimensions } from 'react-native';
+import { computeAnchoredPosition } from "./positioning.js";
+
+/**
+ * Measurement plumbing for `computeAnchoredPosition`.
+ *
+ * Wires the three inputs the pure engine needs: the anchor's window rect
+ * (`measureInWindow`, taken when the overlay opens), the floating content's
+ * size (its `onLayout`), and the window size (re-renders on rotation).
+ *
+ * ```tsx
+ * const { anchorRef, measureAnchor, onContentLayout, position } =
+ *     useAnchoredPosition({ placement: 'bottom' })
+ *
+ * <Pressable ref={anchorRef} onPress={() => { measureAnchor(); open() }} />
+ * <Portal>
+ *   <View
+ *     onLayout={onContentLayout}
+ *     style={position && {
+ *       position: 'absolute', left: position.x, top: position.y,
+ *       maxHeight: position.maxHeight, opacity: 1,
+ *     }}
+ *   />
+ * </Portal>
+ * ```
+ *
+ * `position` is `null` until both measurements land — render the content
+ * transparent (not unmounted, or `onLayout` never fires) until then.
+ */
+export function useAnchoredPosition(options) {
+  const anchorRef = useRef(null);
+  const [anchorRect, setAnchorRect] = useState(null);
+  const [contentSize, setContentSize] = useState(null);
+  const viewport = useWindowDimensions();
+
+  /** Call when opening (and after anything that moves the anchor). */
+  const measureAnchor = useCallback(() => {
+    anchorRef.current?.measureInWindow((x, y, width, height) => {
+      setAnchorRect({
+        x,
+        y,
+        width,
+        height
+      });
+    });
+  }, []);
+  const onContentLayout = useCallback(event => {
+    const {
+      width,
+      height
+    } = event.nativeEvent.layout;
+    setContentSize(previous => previous?.width === width && previous?.height === height ? previous : {
+      width,
+      height
+    });
+  }, []);
+  const position = useMemo(() => {
+    if (!anchorRect || !contentSize) return null;
+    return computeAnchoredPosition({
+      anchor: anchorRect,
+      content: contentSize,
+      viewport: {
+        width: viewport.width,
+        height: viewport.height
+      },
+      placement: options?.placement,
+      alignment: options?.alignment,
+      offset: options?.offset,
+      viewportPadding: options?.viewportPadding
+    });
+  }, [anchorRect, contentSize, viewport.width, viewport.height, options?.placement, options?.alignment, options?.offset, options?.viewportPadding]);
+  return {
+    anchorRef,
+    measureAnchor,
+    onContentLayout,
+    position
+  };
+}
+//# sourceMappingURL=useAnchoredPosition.js.map

package/lib/module/overlay/useAnchoredPosition.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useCallback","useMemo","useRef","useState","useWindowDimensions","computeAnchoredPosition","useAnchoredPosition","options","anchorRef","anchorRect","setAnchorRect","contentSize","setContentSize","viewport","measureAnchor","current","measureInWindow","x","y","width","height","onContentLayout","event","nativeEvent","layout","previous","position","anchor","content","placement","alignment","offset","viewportPadding"],"sourceRoot":"../../../src","sources":["overlay/useAnchoredPosition.ts"],"mappings":";;AAAA,SAASA,WAAW,EAAEC,OAAO,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,OAAO;AAC9D,SACIC,mBAAmB,QAGhB,cAAc;AACrB,SACIC,uBAAuB,QAMpB,kBAAe;;AAEtB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,mBAAmBA,CAACC,OAKnC,EAAE;EACC,MAAMC,SAAS,GAAGN,MAAM,CAAO,IAAI,CAAC;EACpC,MAAM,CAACO,UAAU,EAAEC,aAAa,CAAC,GAAGP,QAAQ,CAAc,IAAI,CAAC;EAC/D,MAAM,CAACQ,WAAW,EAAEC,cAAc,CAAC,GAAGT,QAAQ,CAAc,IAAI,CAAC;EACjE,MAAMU,QAAQ,GAAGT,mBAAmB,CAAC,CAAC;;EAEtC;EACA,MAAMU,aAAa,GAAGd,WAAW,CAAC,MAAM;IACpCQ,SAAS,CAACO,OAAO,EAAEC,eAAe,CAAC,CAACC,CAAC,EAAEC,CAAC,EAAEC,KAAK,EAAEC,MAAM,KAAK;MACxDV,aAAa,CAAC;QAAEO,CAAC;QAAEC,CAAC;QAAEC,KAAK;QAAEC;MAAO,CAAC,CAAC;IAC1C,CAAC,CAAC;EACN,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMC,eAAe,GAAGrB,WAAW,CAAEsB,KAAwB,IAAK;IAC9D,MAAM;MAAEH,KAAK;MAAEC;IAAO,CAAC,GAAGE,KAAK,CAACC,WAAW,CAACC,MAAM;IAClDZ,cAAc,CAAEa,QAAQ,IACpBA,QAAQ,EAAEN,KAAK,KAAKA,KAAK,IAAIM,QAAQ,EAAEL,MAAM,KAAKA,MAAM,GAClDK,QAAQ,GACR;MAAEN,KAAK;MAAEC;IAAO,CAC1B,CAAC;EACL,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMM,QAAQ,GAAGzB,OAAO,CAA0B,MAAM;IACpD,IAAI,CAACQ,UAAU,IAAI,CAACE,WAAW,EAAE,OAAO,IAAI;IAC5C,OAAON,uBAAuB,CAAC;MAC3BsB,MAAM,EAAElB,UAAU;MAClBmB,OAAO,EAAEjB,WAAW;MACpBE,QAAQ,EAAE;QAAEM,KAAK,EAAEN,QAAQ,CAACM,KAAK;QAAEC,MAAM,EAAEP,QAAQ,CAACO;MAAO,CAAC;MAC5DS,SAAS,EAAEtB,OAAO,EAAEsB,SAAS;MAC7BC,SAAS,EAAEvB,OAAO,EAAEuB,SAAS;MAC7BC,MAAM,EAAExB,OAAO,EAAEwB,MAAM;MACvBC,eAAe,EAAEzB,OAAO,EAAEyB;IAC9B,CAAC,CAAC;EACN,CAAC,EAAE,CACCvB,UAAU,EACVE,WAAW,EACXE,QAAQ,CAACM,KAAK,EACdN,QAAQ,CAACO,MAAM,EACfb,OAAO,EAAEsB,SAAS,EAClBtB,OAAO,EAAEuB,SAAS,EAClBvB,OAAO,EAAEwB,MAAM,EACfxB,OAAO,EAAEyB,eAAe,CAC3B,CAAC;EAEF,OAAO;IAAExB,SAAS;IAAEM,aAAa;IAAEO,eAAe;IAAEK;EAAS,CAAC;AAClE","ignoreList":[]}

package/lib/module/package.json

@@ -0,0 +1 @@
+{"type":"module"}

package/lib/module/primitives/Block.js

@@ -0,0 +1,107 @@
+"use strict";
+
+import React, { forwardRef, memo } from 'react';
+import { View, Platform, StyleSheet } from 'react-native';
+import { resolveSurfaceStyle } from "../adapters/surfaceStyle.js";
+
+/**
+ * Native `Block` — a `View` driven by token-shaped style props.
+ *
+ * Style resolution is delegated to `resolveSurfaceStyle`, the same function
+ * `Pressable` uses, so a component that swaps between the two depending on
+ * whether it is interactive (web's `TagElement = onClick ? PrimitiveButton :
+ * Block` pattern) renders identically in both branches. Before that was
+ * shared, `Block` could not render a border, radius, shadow, or height at
+ * all.
+ *
+ * Note there is **no `color` prop**. On web, `Block`'s `color` maps to CSS
+ * `color` — a foreground value that SVG icons inherit via `currentColor`.
+ * RN has no such inheritance, and mapping `color` to `backgroundColor` (as
+ * this file previously did) silently inverted the meaning of every call
+ * copied over from web. Use `backgroundColor` for a background, and `Slot`
+ * for tinting icons.
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+const BlockImpl = /*#__PURE__*/forwardRef(function Block({
+  children,
+  style,
+  ...rest
+}, ref) {
+  // Split token-shaped style props from pass-through RN View props.
+  const {
+    background,
+    backgroundColor,
+    border,
+    borderRadius,
+    boxShadow,
+    paddingTop,
+    paddingRight,
+    paddingBottom,
+    paddingLeft,
+    width,
+    minWidth,
+    maxWidth,
+    height,
+    minHeight,
+    maxHeight,
+    flexDirection,
+    alignItems,
+    justifyContent,
+    alignSelf,
+    gap,
+    flexShrink,
+    flexGrow,
+    opacity,
+    overflow,
+    ...viewProps
+  } = rest;
+  const resolved = resolveSurfaceStyle({
+    background,
+    backgroundColor,
+    border,
+    borderRadius,
+    boxShadow,
+    paddingTop,
+    paddingRight,
+    paddingBottom,
+    paddingLeft,
+    width,
+    minWidth,
+    maxWidth,
+    height,
+    minHeight,
+    maxHeight,
+    flexDirection,
+    alignItems,
+    justifyContent,
+    alignSelf,
+    gap,
+    flexShrink,
+    flexGrow,
+    opacity,
+    overflow
+  }, Platform.OS);
+  return /*#__PURE__*/_jsx(View, {
+    ref: ref,
+    style: StyleSheet.flatten([baseStyle.view, resolved, style]),
+    ...viewProps,
+    children: children
+  });
+});
+
+/**
+ * Memoised because primitives sit at the leaves of every component tree: a
+ * parent re-render should not walk the whole subtree when none of the
+ * token-derived props changed.
+ */
+export const Block = /*#__PURE__*/memo(BlockImpl);
+Block.displayName = 'Block';
+const baseStyle = StyleSheet.create({
+  view: {
+    // RN Views are already flex containers; declaring it keeps parity
+    // with web `Block`, which is `display: flex`.
+    display: 'flex'
+  }
+});
+export default Block;
+//# sourceMappingURL=Block.js.map

package/lib/module/primitives/Block.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","forwardRef","memo","View","Platform","StyleSheet","resolveSurfaceStyle","jsx","_jsx","BlockImpl","Block","children","style","rest","ref","background","backgroundColor","border","borderRadius","boxShadow","paddingTop","paddingRight","paddingBottom","paddingLeft","width","minWidth","maxWidth","height","minHeight","maxHeight","flexDirection","alignItems","justifyContent","alignSelf","gap","flexShrink","flexGrow","opacity","overflow","viewProps","resolved","OS","flatten","baseStyle","view","displayName","create","display"],"sourceRoot":"../../../src","sources":["primitives/Block.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,IAAI,QAAQ,OAAO;AAC/C,SACIC,IAAI,EACJC,QAAQ,EACRC,UAAU,QAIP,cAAc;AACrB,SACIC,mBAAmB,QAEhB,6BAA0B;;AAEjC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAhBA,SAAAC,GAAA,IAAAC,IAAA;AAwBA,MAAMC,SAAS,gBAAGR,UAAU,CAAqB,SAASS,KAAKA,CAC3D;EAAEC,QAAQ;EAAEC,KAAK;EAAE,GAAGC;AAAK,CAAC,EAC5BC,GAAG,EACL;EACE;EACA,MAAM;IACFC,UAAU;IACVC,eAAe;IACfC,MAAM;IACNC,YAAY;IACZC,SAAS;IACTC,UAAU;IACVC,YAAY;IACZC,aAAa;IACbC,WAAW;IACXC,KAAK;IACLC,QAAQ;IACRC,QAAQ;IACRC,MAAM;IACNC,SAAS;IACTC,SAAS;IACTC,aAAa;IACbC,UAAU;IACVC,cAAc;IACdC,SAAS;IACTC,GAAG;IACHC,UAAU;IACVC,QAAQ;IACRC,OAAO;IACPC,QAAQ;IACR,GAAGC;EACP,CAAC,GAAG1B,IAAI;EAER,MAAM2B,QAAQ,GAAGlC,mBAAmB,CAChC;IACIS,UAAU;IACVC,eAAe;IACfC,MAAM;IACNC,YAAY;IACZC,SAAS;IACTC,UAAU;IACVC,YAAY;IACZC,aAAa;IACbC,WAAW;IACXC,KAAK;IACLC,QAAQ;IACRC,QAAQ;IACRC,MAAM;IACNC,SAAS;IACTC,SAAS;IACTC,aAAa;IACbC,UAAU;IACVC,cAAc;IACdC,SAAS;IACTC,GAAG;IACHC,UAAU;IACVC,QAAQ;IACRC,OAAO;IACPC;EACJ,CAAC,EACDlC,QAAQ,CAACqC,EACb,CAAC;EAED,oBACIjC,IAAA,CAACL,IAAI;IACDW,GAAG,EAAEA,GAAI;IACTF,KAAK,EAAEP,UAAU,CAACqC,OAAO,CAAC,CAACC,SAAS,CAACC,IAAI,EAAEJ,QAAQ,EAAE5B,KAAK,CAAC,CAAE;IAAA,GACzD2B,SAAS;IAAA5B,QAAA,EAEZA;EAAQ,CACP,CAAC;AAEf,CAAC,CAAC;;AAEF;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMD,KAAK,gBAAGR,IAAI,CAACO,SAAS,CAAC;AACpCC,KAAK,CAACmC,WAAW,GAAG,OAAO;AAE3B,MAAMF,SAAS,GAAGtC,UAAU,CAACyC,MAAM,CAAC;EAChCF,IAAI,EAAE;IACF;IACA;IACAG,OAAO,EAAE;EACb;AACJ,CAAC,CAAC;AAEF,eAAerC,KAAK","ignoreList":[]}