@buoy-gg/shared-ui 7.0.39 → 7.0.41

package/lib/commonjs/utils/nativeWeb.js

@@ -0,0 +1,454 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {
+  View: true,
+  Text: true,
+  TextInput: true,
+  TouchableOpacity: true,
+  TouchableHighlight: true,
+  TouchableWithoutFeedback: true,
+  Pressable: true,
+  ScrollView: true,
+  Modal: true,
+  Switch: true,
+  ActivityIndicator: true,
+  Button: true,
+  findNodeHandle: true,
+  Alert: true,
+  unstable_createElement: true,
+  NativeModules: true,
+  AccessibilityInfo: true,
+  Animated: true,
+  Appearance: true,
+  AppRegistry: true,
+  AppState: true,
+  BackHandler: true,
+  Clipboard: true,
+  Dimensions: true,
+  Easing: true,
+  I18nManager: true,
+  Keyboard: true,
+  InteractionManager: true,
+  LayoutAnimation: true,
+  Linking: true,
+  NativeEventEmitter: true,
+  PanResponder: true,
+  PixelRatio: true,
+  Platform: true,
+  Share: true,
+  StyleSheet: true,
+  UIManager: true,
+  Vibration: true,
+  CheckBox: true,
+  FlatList: true,
+  Image: true,
+  ImageBackground: true,
+  KeyboardAvoidingView: true,
+  Picker: true,
+  ProgressBar: true,
+  RefreshControl: true,
+  SafeAreaView: true,
+  SectionList: true,
+  StatusBar: true,
+  Touchable: true,
+  TouchableNativeFeedback: true,
+  VirtualizedList: true,
+  YellowBox: true,
+  LogBox: true,
+  DeviceEventEmitter: true,
+  useColorScheme: true,
+  useLocaleContext: true,
+  useWindowDimensions: true
+};
+Object.defineProperty(exports, "AccessibilityInfo", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.AccessibilityInfo;
+  }
+});
+exports.Alert = exports.ActivityIndicator = void 0;
+Object.defineProperty(exports, "Animated", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.Animated;
+  }
+});
+Object.defineProperty(exports, "AppRegistry", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.AppRegistry;
+  }
+});
+Object.defineProperty(exports, "AppState", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.AppState;
+  }
+});
+Object.defineProperty(exports, "Appearance", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.Appearance;
+  }
+});
+Object.defineProperty(exports, "BackHandler", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.BackHandler;
+  }
+});
+exports.Button = void 0;
+Object.defineProperty(exports, "CheckBox", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.CheckBox;
+  }
+});
+Object.defineProperty(exports, "Clipboard", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.Clipboard;
+  }
+});
+Object.defineProperty(exports, "DeviceEventEmitter", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.DeviceEventEmitter;
+  }
+});
+Object.defineProperty(exports, "Dimensions", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.Dimensions;
+  }
+});
+Object.defineProperty(exports, "Easing", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.Easing;
+  }
+});
+Object.defineProperty(exports, "FlatList", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.FlatList;
+  }
+});
+Object.defineProperty(exports, "I18nManager", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.I18nManager;
+  }
+});
+Object.defineProperty(exports, "Image", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.Image;
+  }
+});
+Object.defineProperty(exports, "ImageBackground", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.ImageBackground;
+  }
+});
+Object.defineProperty(exports, "InteractionManager", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.InteractionManager;
+  }
+});
+Object.defineProperty(exports, "Keyboard", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.Keyboard;
+  }
+});
+Object.defineProperty(exports, "KeyboardAvoidingView", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.KeyboardAvoidingView;
+  }
+});
+Object.defineProperty(exports, "LayoutAnimation", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.LayoutAnimation;
+  }
+});
+Object.defineProperty(exports, "Linking", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.Linking;
+  }
+});
+Object.defineProperty(exports, "LogBox", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.LogBox;
+  }
+});
+exports.Modal = void 0;
+Object.defineProperty(exports, "NativeEventEmitter", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.NativeEventEmitter;
+  }
+});
+Object.defineProperty(exports, "NativeModules", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.NativeModules;
+  }
+});
+Object.defineProperty(exports, "PanResponder", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.PanResponder;
+  }
+});
+Object.defineProperty(exports, "Picker", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.Picker;
+  }
+});
+Object.defineProperty(exports, "PixelRatio", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.PixelRatio;
+  }
+});
+Object.defineProperty(exports, "Platform", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.Platform;
+  }
+});
+exports.Pressable = void 0;
+Object.defineProperty(exports, "ProgressBar", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.ProgressBar;
+  }
+});
+Object.defineProperty(exports, "RefreshControl", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.RefreshControl;
+  }
+});
+Object.defineProperty(exports, "SafeAreaView", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.SafeAreaView;
+  }
+});
+exports.ScrollView = void 0;
+Object.defineProperty(exports, "SectionList", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.SectionList;
+  }
+});
+Object.defineProperty(exports, "Share", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.Share;
+  }
+});
+Object.defineProperty(exports, "StatusBar", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.StatusBar;
+  }
+});
+Object.defineProperty(exports, "StyleSheet", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.StyleSheet;
+  }
+});
+exports.TextInput = exports.Text = exports.Switch = void 0;
+Object.defineProperty(exports, "Touchable", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.Touchable;
+  }
+});
+exports.TouchableHighlight = void 0;
+Object.defineProperty(exports, "TouchableNativeFeedback", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.TouchableNativeFeedback;
+  }
+});
+exports.TouchableWithoutFeedback = exports.TouchableOpacity = void 0;
+Object.defineProperty(exports, "UIManager", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.UIManager;
+  }
+});
+Object.defineProperty(exports, "Vibration", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.Vibration;
+  }
+});
+exports.View = void 0;
+Object.defineProperty(exports, "VirtualizedList", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.VirtualizedList;
+  }
+});
+Object.defineProperty(exports, "YellowBox", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.YellowBox;
+  }
+});
+exports.findNodeHandle = void 0;
+Object.defineProperty(exports, "unstable_createElement", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.unstable_createElement;
+  }
+});
+Object.defineProperty(exports, "useColorScheme", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.useColorScheme;
+  }
+});
+Object.defineProperty(exports, "useLocaleContext", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.useLocaleContext;
+  }
+});
+Object.defineProperty(exports, "useWindowDimensions", {
+  enumerable: true,
+  get: function () {
+    return nativeWeb.useWindowDimensions;
+  }
+});
+var nativeWeb = _interopRequireWildcard(require("react-native-web"));
+Object.keys(nativeWeb).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === nativeWeb[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return nativeWeb[key];
+    }
+  });
+});
+var _react = require("react");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+// Explicit exports also support the package's split ESM entry points.
+
+// React Native groups these values; React Native Web expects individual ARIA props.
+function withAccessibility(component) {
+  const wrapped = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
+    const {
+      accessibilityState,
+      accessibilityValue,
+      ...rest
+    } = props;
+    for (const key of ['busy', 'checked', 'disabled', 'expanded', 'selected']) {
+      if (accessibilityState?.[key] !== undefined && rest[`aria-${key}`] === undefined) {
+        rest[`aria-${key}`] = accessibilityState[key];
+      }
+    }
+    for (const [key, aria] of Object.entries({
+      min: 'valuemin',
+      max: 'valuemax',
+      now: 'valuenow',
+      text: 'valuetext'
+    })) {
+      if (accessibilityValue?.[key] !== undefined && rest[`aria-${aria}`] === undefined) {
+        rest[`aria-${aria}`] = accessibilityValue[key];
+      }
+    }
+    return /*#__PURE__*/(0, _react.createElement)(component, {
+      ...rest,
+      ref
+    });
+  });
+  const state = component.State;
+  if (state) Object.assign(wrapped, {
+    State: state
+  });
+  wrapped.displayName = component.displayName ?? component.name ?? 'NativeWebView';
+  return wrapped;
+}
+const View = exports.View = withAccessibility(nativeWeb.View);
+const Text = exports.Text = withAccessibility(nativeWeb.Text);
+const TextInput = exports.TextInput = withAccessibility(nativeWeb.TextInput);
+const TouchableOpacity = exports.TouchableOpacity = withAccessibility(nativeWeb.TouchableOpacity);
+const TouchableHighlight = exports.TouchableHighlight = withAccessibility(nativeWeb.TouchableHighlight);
+const TouchableWithoutFeedback = exports.TouchableWithoutFeedback = withAccessibility(nativeWeb.TouchableWithoutFeedback);
+const Pressable = exports.Pressable = withAccessibility(nativeWeb.Pressable);
+const ScrollView = exports.ScrollView = withAccessibility(nativeWeb.ScrollView);
+const Modal = exports.Modal = withAccessibility(nativeWeb.Modal);
+const Switch = exports.Switch = withAccessibility(nativeWeb.Switch);
+const ActivityIndicator = exports.ActivityIndicator = withAccessibility(nativeWeb.ActivityIndicator);
+const Button = exports.Button = withAccessibility(nativeWeb.Button);
+
+// RNW implements this API, but its community types omit it.
+const findNodeHandle = exports.findNodeHandle = nativeWeb.findNodeHandle;
+/** Browser confirmation dialogs for the shared React Native tool panels. */
+const Alert = exports.Alert = {
+  alert(title, message, buttons, options) {
+    if (typeof document === 'undefined') return;
+    const dialog = document.createElement('dialog');
+    dialog.dataset.buoyRoot = '';
+    dialog.setAttribute('aria-label', title);
+    dialog.style.cssText = 'position:fixed;inset:0;margin:auto;width:min(440px,90vw);padding:24px;border:1px solid #475569;border-radius:14px;background:#17212e;color:#f1f5f9;font:14px system-ui;box-shadow:0 20px 80px #0008;z-index:2147483647';
+    const heading = document.createElement('h2');
+    heading.textContent = title;
+    heading.style.cssText = 'font-size:18px;margin:0 0 12px';
+    dialog.appendChild(heading);
+    if (message) {
+      const body = document.createElement('p');
+      body.textContent = message;
+      body.style.cssText = 'line-height:1.5;white-space:pre-wrap;margin:0 0 20px';
+      dialog.appendChild(body);
+    }
+    const row = document.createElement('div');
+    row.style.cssText = 'display:flex;justify-content:flex-end;flex-wrap:wrap;gap:8px';
+    const choices = buttons?.length ? buttons : [{
+      text: 'OK'
+    }];
+    const close = () => {
+      dialog.close?.();
+      dialog.remove();
+    };
+    for (const choice of choices) {
+      const button = document.createElement('button');
+      button.type = 'button';
+      button.textContent = choice.text ?? 'OK';
+      button.style.cssText = `padding:9px 14px;border:1px solid #64748b;border-radius:7px;color:white;background:${choice.style === 'destructive' ? '#a52b38' : '#283a4d'};cursor:pointer;font:inherit`;
+      button.onclick = () => {
+        close();
+        choice.onPress?.();
+      };
+      row.appendChild(button);
+    }
+    dialog.addEventListener('cancel', event => {
+      event.preventDefault();
+      if (options?.cancelable === false) return;
+      close();
+      options?.onDismiss?.();
+    });
+    dialog.appendChild(row);
+    document.body.appendChild(dialog);
+    if (dialog.showModal) dialog.showModal();else dialog.setAttribute('open', '');
+  }
+};

package/lib/commonjs/utils/persistentStorage.web.js

@@ -0,0 +1,78 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getStorageBackendType = getStorageBackendType;
+exports.isUsingPersistentStorage = isUsingPersistentStorage;
+exports.persistentStorage = void 0;
+var _devToolsStorageKeys = require("../storage/devToolsStorageKeys.js");
+// Retain writes if storage is blocked or full. Null entries mask failed removals.
+const pending = new Map();
+function storage() {
+  try {
+    return typeof window === "undefined" ? null : window.localStorage;
+  } catch {
+    return null;
+  }
+}
+const persistentStorage = exports.persistentStorage = {
+  async getItem(key) {
+    if (pending.has(key)) return pending.get(key) ?? null;
+    try {
+      return storage()?.getItem(key) ?? null;
+    } catch {
+      return null;
+    }
+  },
+  async setItem(key, value) {
+    pending.set(key, value);
+    try {
+      const backend = storage();
+      if (backend) {
+        backend.setItem(key, value);
+        pending.delete(key);
+      }
+    } catch {/* Keep the value for this session. */}
+  },
+  async removeItem(key) {
+    pending.set(key, null);
+    try {
+      const backend = storage();
+      if (backend) {
+        backend.removeItem(key);
+        pending.delete(key);
+      }
+    } catch {/* Keep the removal for this session. */}
+  },
+  async getAllKeys() {
+    const keys = new Set();
+    try {
+      const backend = storage();
+      if (backend) for (let i = 0; i < backend.length; i++) {
+        const key = backend.key(i);
+        if (key?.startsWith(_devToolsStorageKeys.devToolsStorageKeys.base)) keys.add(key);
+      }
+    } catch {/* Pending entries remain available. */}
+    for (const [key, value] of pending) {
+      if (!key.startsWith(_devToolsStorageKeys.devToolsStorageKeys.base)) continue;
+      if (value === null) keys.delete(key);else keys.add(key);
+    }
+    return [...keys];
+  },
+  async multiGet(keys) {
+    return Promise.all(keys.map(async key => [key, await persistentStorage.getItem(key)]));
+  },
+  async multiRemove(keys) {
+    await Promise.all(keys.map(key => persistentStorage.removeItem(key)));
+  },
+  async clear() {
+    await persistentStorage.multiRemove(await persistentStorage.getAllKeys());
+  }
+};
+async function isUsingPersistentStorage() {
+  return storage() !== null;
+}
+async function getStorageBackendType() {
+  return storage() ? "localstorage" : "memory";
+}

package/lib/commonjs/utils/reloadApp.js

@@ -7,62 +7,18 @@ exports.REMOTE_RELOAD_DELAY_MS = void 0;
 exports.reloadApp = reloadApp;
 exports.resolveReloadStrategy = resolveReloadStrategy;
 exports.scheduleReloadApp = scheduleReloadApp;
+var _reloadPlatform = require("./reloadPlatform");
 /**
- * reloadApp
+ * Reload the app after callers persist any state they need to keep.
  *
- * Programmatic JS-bundle reload primitive. Two strategies, picked at runtime:
- *
- * - `dev-settings`: React Native core's `DevSettings.reload()`. Works in
- *   __DEV__ builds (including Expo Go) with zero deps, but throws in
- *   release.
- * - `expo-updates`: `Updates.reloadAsync()` from the `expo-updates`
- *   package. Works in dev clients and production, but fails in Expo Go
- *   and is not bundled with any Buoy package — host apps opt in by
- *   installing `expo-updates` separately.
- *
- * "auto" prefers `dev-settings` in __DEV__ and falls back to
- * `expo-updates` otherwise. The dynamic `require` keeps `expo-updates` an
- * optional peer — Expo Go users never load it.
- *
- * Lives in shared (not in a tool package) because BOTH the always-installed
- * core — whose `app` sync adapter exposes reload to remote drivers like the
- * MCP server — and perf-monitor's batch runner (reload between cases) need it,
- * and reloading must not require a tool with native peer deps.
- *
- * IMPORTANT: callers must persist any state they need to survive BEFORE
- * invoking this. Once the reload fires, the JS realm is gone — there is
- * no "after" code path.
+ * Native auto mode uses DevSettings in development, then falls back to the
+ * optional expo-updates package. Browser auto mode uses location.reload().
+ * A successful reload tears down the JS realm, so reloadApp never resolves.
+ * scheduleReloadApp delays the reload so a remote caller can receive its reply.
  */
 
 /** The concrete mechanism a `ReloadStrategy` resolves to at runtime. */
 
-function loadDevSettings() {
-  try {
-    // Prefer the core RN module; cast to unknown first so TS doesn't try
-    // to follow into RN's typings (the package may not be in the type
-    // graph in some build setups).
-    const rn = require("react-native");
-    const ds = rn?.DevSettings;
-    if (ds && typeof ds.reload === "function") {
-      return ds;
-    }
-  } catch {
-    // fall through
-  }
-  return null;
-}
-function loadExpoUpdates() {
-  try {
-    const mod = require("expo-updates");
-    if (mod && typeof mod.reloadAsync === "function") {
-      return mod;
-    }
-  } catch {
-    // expo-updates not installed
-  }
-  return null;
-}
-
 /**
  * Which mechanism `strategy` would actually use right now, or null when none
  * is available. Lets a caller check reloadability BEFORE committing (e.g. a
@@ -70,18 +26,21 @@ function loadExpoUpdates() {
  * the reload fires there is no code path left to answer from).
  */
 function resolveReloadStrategy(strategy = "auto") {
+  if (strategy === "browser") return (0, _reloadPlatform.loadBrowserReload)() ? "browser" : null;
+  if (strategy === "auto" && (0, _reloadPlatform.loadBrowserReload)()) return "browser";
   if (strategy === "dev-settings") {
-    return loadDevSettings() ? "dev-settings" : null;
+    return (0, _reloadPlatform.loadDevSettings)() ? "dev-settings" : null;
   }
   if (strategy === "expo-updates") {
-    return loadExpoUpdates() ? "expo-updates" : null;
+    return (0, _reloadPlatform.loadExpoUpdates)() ? "expo-updates" : null;
   }
-  if (__DEV__ && loadDevSettings()) return "dev-settings";
-  return loadExpoUpdates() ? "expo-updates" : null;
+  if (__DEV__ && (0, _reloadPlatform.loadDevSettings)()) return "dev-settings";
+  return (0, _reloadPlatform.loadExpoUpdates)() ? "expo-updates" : null;
 }
 
 /** Why `strategy` can't run, phrased for the person who has to fix it. */
 function unavailableMessage(strategy) {
+  if (strategy === "browser") return "[buoy] Browser reload requires a browser window.";
   if (strategy === "dev-settings") {
     return "[buoy] DevSettings.reload() unavailable — strategy 'dev-settings' requires React Native dev mode.";
   }
@@ -99,10 +58,12 @@ function unavailableMessage(strategy) {
 async function reloadApp(strategy = "auto", reason = "buoy reload") {
   const resolved = resolveReloadStrategy(strategy);
   if (!resolved) throw new Error(unavailableMessage(strategy));
-  if (resolved === "dev-settings") {
-    loadDevSettings().reload(reason);
+  if (resolved === "browser") {
+    (0, _reloadPlatform.loadBrowserReload)()();
+  } else if (resolved === "dev-settings") {
+    (0, _reloadPlatform.loadDevSettings)().reload(reason);
   } else {
-    await loadExpoUpdates().reloadAsync();
+    await (0, _reloadPlatform.loadExpoUpdates)().reloadAsync();
   }
   return await new Promise(() => {});
 }

package/lib/commonjs/utils/reloadPlatform.js

@@ -0,0 +1,37 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.loadBrowserReload = loadBrowserReload;
+exports.loadDevSettings = loadDevSettings;
+exports.loadExpoUpdates = loadExpoUpdates;
+function loadDevSettings() {
+  try {
+    // Prefer the core RN module; cast to unknown first so TS doesn't try
+    // to follow into RN's typings (the package may not be in the type
+    // graph in some build setups).
+    const rn = require("react-native");
+    const ds = rn?.DevSettings;
+    if (ds && typeof ds.reload === "function") {
+      return ds;
+    }
+  } catch {
+    // fall through
+  }
+  return null;
+}
+function loadExpoUpdates() {
+  try {
+    const mod = require("expo-updates");
+    if (mod && typeof mod.reloadAsync === "function") {
+      return mod;
+    }
+  } catch {
+    // expo-updates not installed
+  }
+  return null;
+}
+function loadBrowserReload() {
+  return null;
+}

package/lib/commonjs/utils/reloadPlatform.web.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.loadBrowserReload = loadBrowserReload;
+exports.loadDevSettings = loadDevSettings;
+exports.loadExpoUpdates = loadExpoUpdates;
+function loadDevSettings() {
+  return null;
+}
+function loadExpoUpdates() {
+  return null;
+}
+function loadBrowserReload() {
+  return typeof window === "undefined" ? null : () => window.location.reload();
+}