@buoy-gg/shared-ui 7.0.39 → 7.0.41

package/lib/web/chunks/chunk-KBTYK5YE.mjs

@@ -0,0 +1,662 @@
+"use client";
+import {
+  persistentStorage
+} from "./chunk-JR7BJW6B.mjs";
+
+// src/hooks/usePersistedState.ts
+import { useCallback, useEffect, useRef, useState } from "react";
+var hydratedCache = /* @__PURE__ */ new Map();
+function defaultParse(raw) {
+  try {
+    return JSON.parse(raw);
+  } catch {
+    return void 0;
+  }
+}
+function usePersistedState(key, defaultValue, options = {}) {
+  const [value, setValue] = useState(
+    () => hydratedCache.has(key) ? hydratedCache.get(key) : defaultValue
+  );
+  const [hydrated, setHydrated] = useState(() => hydratedCache.has(key));
+  const keyRef = useRef(key);
+  keyRef.current = key;
+  const optionsRef = useRef(options);
+  optionsRef.current = options;
+  useEffect(() => {
+    if (hydratedCache.has(key)) {
+      setValue(hydratedCache.get(key));
+      setHydrated(true);
+      return;
+    }
+    let cancelled = false;
+    const storage = optionsRef.current.storage ?? persistentStorage;
+    const parse = optionsRef.current.parse ?? defaultParse;
+    storage.getItem(key).then((raw) => {
+      if (cancelled) return;
+      if (raw != null) {
+        let parsed;
+        try {
+          parsed = parse(raw);
+        } catch {
+        }
+        if (parsed !== void 0) {
+          hydratedCache.set(key, parsed);
+          setValue(parsed);
+        }
+      }
+      setHydrated(true);
+    }).catch(() => {
+      if (!cancelled) setHydrated(true);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [key]);
+  const set = useCallback((next) => {
+    setValue((prev) => {
+      const resolved = typeof next === "function" ? next(prev) : next;
+      hydratedCache.set(keyRef.current, resolved);
+      const storage = optionsRef.current.storage ?? persistentStorage;
+      const serialize = optionsRef.current.serialize ?? JSON.stringify;
+      try {
+        storage.setItem(keyRef.current, serialize(resolved)).catch(() => {
+        });
+      } catch {
+      }
+      return resolved;
+    });
+  }, []);
+  return [value, set, hydrated];
+}
+function resetPersistedStateCache() {
+  hydratedCache.clear();
+}
+
+// src/hooks/useChangeLog.ts
+import { useCallback as useCallback2, useEffect as useEffect2, useMemo, useState as useState2 } from "react";
+function useChangeLog(log, options = {}) {
+  const [items, setItems] = useState2(() => log.getAll());
+  const [filter, setFilter] = useState2(() => options.initialFilter ?? {});
+  const [isEnabled, setIsEnabled] = useState2(() => log.getEnabled());
+  useEffect2(() => log.subscribe(setItems), [log]);
+  const filterItems = options.filterItems;
+  const filteredItems = useMemo(
+    () => filterItems ? filterItems(items, filter) : items,
+    [items, filter, filterItems]
+  );
+  const clear = useCallback2(() => {
+    log.clear();
+  }, [log]);
+  const toggleCapture = useCallback2(() => {
+    const next = !isEnabled;
+    log.setEnabled(next);
+    setIsEnabled(next);
+  }, [log, isEnabled]);
+  const getById = useCallback2((id) => log.getById(id), [log]);
+  return { items, filteredItems, filter, setFilter, isEnabled, toggleCapture, clear, getById };
+}
+function useSubscribedValue(read, subscribe) {
+  const [value, setValue] = useState2(read);
+  useEffect2(() => subscribe(setValue), [subscribe]);
+  return value;
+}
+
+// src/hooks/useEventStoreEvents.ts
+import { useCallback as useCallback3, useEffect as useEffect3, useState as useState3 } from "react";
+function useEventStoreEvents(store, options = {}) {
+  const { enabled = true, maxEvents = 500, select } = options;
+  const [events, setEvents] = useState3([]);
+  const [isActive, setIsActive] = useState3(enabled);
+  useEffect3(() => {
+    if (!enabled) {
+      setIsActive(false);
+      return;
+    }
+    let rafId = null;
+    let pending = null;
+    const unsubscribe = store.subscribeToEvents((all) => {
+      pending = all;
+      if (rafId != null) return;
+      rafId = requestAnimationFrame(() => {
+        rafId = null;
+        if (!pending) return;
+        let next = pending;
+        pending = null;
+        if (select) next = select(next);
+        if (next.length > maxEvents) next = next.slice(0, maxEvents);
+        setEvents(next);
+      });
+    });
+    setIsActive(true);
+    return () => {
+      unsubscribe();
+      if (rafId != null) cancelAnimationFrame(rafId);
+    };
+  }, [store, enabled, maxEvents, select]);
+  const clearEvents = useCallback3(() => {
+    store.clearEvents();
+  }, [store]);
+  return { events, clearEvents, isActive };
+}
+
+// src/hooks/useDeviceInfo.ts
+import { useState as useState4, useEffect as useEffect4, useCallback as useCallback4 } from "react";
+import {
+  Platform,
+  Dimensions,
+  PixelRatio,
+  AccessibilityInfo,
+  Appearance,
+  I18nManager,
+  NativeModules,
+  Keyboard,
+  AppState,
+  StatusBar
+} from "react-native-web";
+async function getAccessibilitySettings() {
+  const [
+    isScreenReaderEnabled,
+    isReduceMotionEnabled,
+    isReduceTransparencyEnabled
+  ] = await Promise.all([
+    AccessibilityInfo.isScreenReaderEnabled(),
+    AccessibilityInfo.isReduceMotionEnabled(),
+    AccessibilityInfo.isReduceTransparencyEnabled()
+  ]);
+  const settings = {
+    isScreenReaderEnabled,
+    isReduceMotionEnabled,
+    isReduceTransparencyEnabled
+  };
+  if (Platform.OS === "ios") {
+    const [
+      isBoldTextEnabled,
+      isGrayscaleEnabled,
+      isInvertColorsEnabled,
+      isDarkerSystemColorsEnabled,
+      prefersCrossFadeTransitions
+    ] = await Promise.all([
+      AccessibilityInfo.isBoldTextEnabled?.() ?? Promise.resolve(false),
+      AccessibilityInfo.isGrayscaleEnabled?.() ?? Promise.resolve(false),
+      AccessibilityInfo.isInvertColorsEnabled?.() ?? Promise.resolve(false),
+      // @ts-ignore - may not be typed
+      AccessibilityInfo.isDarkerSystemColorsEnabled?.() ?? Promise.resolve(false),
+      // @ts-ignore - may not be typed
+      AccessibilityInfo.prefersCrossFadeTransitions?.() ?? Promise.resolve(false)
+    ]);
+    settings.isBoldTextEnabled = isBoldTextEnabled;
+    settings.isGrayscaleEnabled = isGrayscaleEnabled;
+    settings.isInvertColorsEnabled = isInvertColorsEnabled;
+    settings.isDarkerSystemColorsEnabled = isDarkerSystemColorsEnabled;
+    settings.prefersCrossFadeTransitions = prefersCrossFadeTransitions;
+  }
+  if (Platform.OS === "android") {
+    const isHighTextContrastEnabled = await AccessibilityInfo.isHighTextContrastEnabled?.() ?? false;
+    settings.isHighTextContrastEnabled = isHighTextContrastEnabled;
+  }
+  return settings;
+}
+function getPlatformInfo() {
+  const constants = Platform.constants;
+  const base = {
+    os: Platform.OS,
+    version: Platform.Version,
+    reactNativeVersion: constants.reactNativeVersion,
+    isTesting: Platform.isTesting ?? false,
+    isDisableAnimations: constants.isDisableAnimations ?? false
+  };
+  if (Platform.OS === "ios") {
+    return {
+      ...base,
+      osVersion: constants.osVersion,
+      systemName: constants.systemName,
+      interfaceIdiom: constants.interfaceIdiom,
+      isPad: Platform.isPad,
+      isTV: Platform.isTV,
+      isVision: Platform.isVision ?? false,
+      isMacCatalyst: Platform.isMacCatalyst ?? false,
+      forceTouchAvailable: constants.forceTouchAvailable
+    };
+  }
+  if (Platform.OS === "android") {
+    return {
+      ...base,
+      apiLevel: constants.Version,
+      release: constants.Release,
+      brand: constants.Brand,
+      manufacturer: constants.Manufacturer,
+      model: constants.Model,
+      fingerprint: constants.Fingerprint,
+      serial: constants.Serial,
+      uiMode: constants.uiMode
+    };
+  }
+  return base;
+}
+function getDisplayInfo() {
+  const window = Dimensions.get("window");
+  const screen = Dimensions.get("screen");
+  const info = {
+    window: {
+      width: window.width,
+      height: window.height,
+      scale: window.scale,
+      fontScale: window.fontScale
+    },
+    screen: {
+      width: screen.width,
+      height: screen.height,
+      scale: screen.scale,
+      fontScale: screen.fontScale
+    },
+    pixelRatio: PixelRatio.get(),
+    fontScale: PixelRatio.getFontScale(),
+    isLandscape: window.width > window.height,
+    isPortrait: window.height > window.width
+  };
+  if (Platform.OS === "ios") {
+    try {
+      const deviceInfo = NativeModules.DeviceInfo?.getConstants?.();
+      info.isIPhoneNotched = deviceInfo?.isIPhoneX_deprecated ?? false;
+    } catch {
+      info.isIPhoneNotched = false;
+    }
+  }
+  if (Platform.OS === "android") {
+    try {
+      const deviceInfo = NativeModules.DeviceInfo?.getConstants?.();
+      info.isEdgeToEdge = deviceInfo?.isEdgeToEdge ?? false;
+      info.densityDpi = Math.round(window.scale * 160);
+    } catch {
+    }
+  }
+  return info;
+}
+async function getStatusBarHeight() {
+  return new Promise((resolve) => {
+    let resolved = false;
+    if (Platform.OS === "ios") {
+      NativeModules.StatusBarManager?.getHeight?.(
+        (result) => {
+          if (!resolved) {
+            resolved = true;
+            resolve(result?.height ?? null);
+          }
+        }
+      ) ?? resolve(null);
+    } else if (Platform.OS === "android") {
+      resolved = true;
+      resolve(StatusBar.currentHeight ?? null);
+    } else {
+      resolved = true;
+      resolve(null);
+    }
+    setTimeout(() => {
+      if (!resolved) {
+        resolved = true;
+        resolve(null);
+      }
+    }, 100);
+  });
+}
+function getLocaleInfo() {
+  const info = {
+    isRTL: I18nManager.isRTL,
+    doLeftAndRightSwapInRTL: I18nManager.doLeftAndRightSwapInRTL
+  };
+  if (Platform.OS === "android") {
+    info.localeIdentifier = I18nManager.localeIdentifier;
+  }
+  return info;
+}
+function getSettingsInfo() {
+  if (Platform.OS === "ios") {
+    try {
+      const constants = NativeModules.SettingsManager?.getConstants?.();
+      return {
+        userDefaults: constants?.settings ?? {}
+      };
+    } catch {
+      return {};
+    }
+  }
+  return {};
+}
+function getUniqueIdentifiers() {
+  const identifiers = {};
+  if (Platform.OS === "android") {
+    const constants = Platform.constants;
+    identifiers.serial = constants.Serial;
+    identifiers.fingerprint = constants.Fingerprint;
+    try {
+      const PlatformConstants = NativeModules.PlatformConstants;
+      if (PlatformConstants?.getAndroidID) {
+        identifiers.androidId = PlatformConstants.getAndroidID();
+      }
+    } catch {
+    }
+  }
+  return identifiers;
+}
+function generateFingerprint(info) {
+  const components = [
+    // Platform
+    info.platform.os,
+    info.platform.version,
+    // Display (most stable - identifies device model)
+    info.display.window.width,
+    info.display.window.height,
+    info.display.pixelRatio,
+    // iOS specific
+    info.platform.interfaceIdiom ?? "",
+    info.platform.forceTouchAvailable ?? false,
+    info.display.isIPhoneNotched ?? false,
+    // Android specific
+    info.platform.model ?? "",
+    info.platform.brand ?? "",
+    info.platform.manufacturer ?? "",
+    info.platform.uiMode ?? ""
+  ];
+  const str = components.join("|");
+  let hash = 0;
+  for (let i = 0; i < str.length; i++) {
+    const char = str.charCodeAt(i);
+    hash = (hash << 5) - hash + char;
+    hash = hash & hash;
+  }
+  return Math.abs(hash).toString(16).padStart(8, "0");
+}
+function useDeviceInfo() {
+  const [isLoading, setIsLoading] = useState4(true);
+  const [platform, setPlatform] = useState4(getPlatformInfo());
+  const [display, setDisplay] = useState4(getDisplayInfo());
+  const [accessibility, setAccessibility] = useState4({
+    isScreenReaderEnabled: false,
+    isReduceMotionEnabled: false,
+    isReduceTransparencyEnabled: false
+  });
+  const [appearance, setAppearance] = useState4(() => {
+    const colorScheme = Appearance.getColorScheme() ?? null;
+    return {
+      colorScheme,
+      prefersDarkMode: colorScheme === "dark"
+    };
+  });
+  const [locale, setLocale] = useState4(getLocaleInfo());
+  const [statusBar, setStatusBar] = useState4({
+    height: null,
+    isVisible: true
+  });
+  const [keyboard, setKeyboard] = useState4({
+    isVisible: false,
+    height: 0,
+    animationDuration: 0
+  });
+  const [appStateInfo, setAppStateInfo] = useState4({
+    currentState: AppState.currentState,
+    isActive: AppState.currentState === "active"
+  });
+  const [identifiers, setIdentifiers] = useState4(
+    getUniqueIdentifiers()
+  );
+  const [settings, setSettings] = useState4(getSettingsInfo());
+  const [timestamp, setTimestamp] = useState4(Date.now());
+  const refresh = useCallback4(async () => {
+    setIsLoading(true);
+    const [accessibilitySettings, statusBarHeight] = await Promise.all([
+      getAccessibilitySettings(),
+      getStatusBarHeight()
+    ]);
+    setPlatform(getPlatformInfo());
+    setDisplay(getDisplayInfo());
+    setAccessibility(accessibilitySettings);
+    const currentColorScheme = Appearance.getColorScheme() ?? null;
+    setAppearance({
+      colorScheme: currentColorScheme,
+      prefersDarkMode: currentColorScheme === "dark"
+    });
+    setLocale(getLocaleInfo());
+    setStatusBar((prev) => ({
+      ...prev,
+      height: statusBarHeight
+    }));
+    setIdentifiers(getUniqueIdentifiers());
+    setSettings(getSettingsInfo());
+    setTimestamp(Date.now());
+    setIsLoading(false);
+  }, []);
+  useEffect4(() => {
+    refresh();
+  }, [refresh]);
+  useEffect4(() => {
+    const subscription = Dimensions.addEventListener(
+      "change",
+      ({ window, screen }) => {
+        setDisplay((prev) => ({
+          ...prev,
+          window: {
+            width: window.width,
+            height: window.height,
+            scale: window.scale,
+            fontScale: window.fontScale
+          },
+          screen: {
+            width: screen.width,
+            height: screen.height,
+            scale: screen.scale,
+            fontScale: screen.fontScale
+          },
+          isLandscape: window.width > window.height,
+          isPortrait: window.height > window.width
+        }));
+      }
+    );
+    return () => subscription.remove();
+  }, []);
+  useEffect4(() => {
+    const subscription = Appearance.addChangeListener(({ colorScheme }) => {
+      const scheme = colorScheme ?? null;
+      setAppearance({
+        colorScheme: scheme,
+        prefersDarkMode: scheme === "dark"
+      });
+    });
+    return () => subscription.remove();
+  }, []);
+  useEffect4(() => {
+    const showListener = Keyboard.addListener(
+      Platform.OS === "ios" ? "keyboardWillShow" : "keyboardDidShow",
+      (event) => {
+        setKeyboard({
+          isVisible: true,
+          height: event.endCoordinates.height,
+          animationDuration: event.duration ?? 0
+        });
+      }
+    );
+    const hideListener = Keyboard.addListener(
+      Platform.OS === "ios" ? "keyboardWillHide" : "keyboardDidHide",
+      (event) => {
+        setKeyboard({
+          isVisible: false,
+          height: 0,
+          animationDuration: event.duration ?? 0
+        });
+      }
+    );
+    return () => {
+      showListener.remove();
+      hideListener.remove();
+    };
+  }, []);
+  useEffect4(() => {
+    const subscription = AppState.addEventListener("change", (nextState) => {
+      setAppStateInfo({
+        currentState: nextState,
+        isActive: nextState === "active"
+      });
+    });
+    return () => subscription.remove();
+  }, []);
+  useEffect4(() => {
+    const listeners = [
+      AccessibilityInfo.addEventListener("screenReaderChanged", (isEnabled) => {
+        setAccessibility((prev) => ({
+          ...prev,
+          isScreenReaderEnabled: isEnabled
+        }));
+      }),
+      AccessibilityInfo.addEventListener("reduceMotionChanged", (isEnabled) => {
+        setAccessibility((prev) => ({
+          ...prev,
+          isReduceMotionEnabled: isEnabled
+        }));
+      }),
+      AccessibilityInfo.addEventListener(
+        "reduceTransparencyChanged",
+        (isEnabled) => {
+          setAccessibility((prev) => ({
+            ...prev,
+            isReduceTransparencyEnabled: isEnabled
+          }));
+        }
+      )
+    ];
+    if (Platform.OS === "ios") {
+      const addIOSListener = (eventName, handler) => {
+        return AccessibilityInfo.addEventListener(eventName, handler);
+      };
+      listeners.push(
+        addIOSListener("boldTextChanged", (isEnabled) => {
+          setAccessibility((prev) => ({
+            ...prev,
+            isBoldTextEnabled: isEnabled
+          }));
+        }),
+        addIOSListener("grayscaleChanged", (isEnabled) => {
+          setAccessibility((prev) => ({
+            ...prev,
+            isGrayscaleEnabled: isEnabled
+          }));
+        }),
+        addIOSListener("invertColorsChanged", (isEnabled) => {
+          setAccessibility((prev) => ({
+            ...prev,
+            isInvertColorsEnabled: isEnabled
+          }));
+        })
+      );
+    }
+    return () => {
+      listeners.forEach((listener) => listener.remove());
+    };
+  }, []);
+  const deviceInfo = {
+    platform,
+    display,
+    accessibility,
+    appearance,
+    locale,
+    statusBar,
+    keyboard,
+    appState: appStateInfo,
+    identifiers,
+    settings,
+    timestamp,
+    isLoading,
+    refresh,
+    generateFingerprint: () => generateFingerprint({
+      platform,
+      display,
+      accessibility,
+      appearance,
+      locale,
+      statusBar,
+      keyboard,
+      appState: appStateInfo,
+      identifiers,
+      settings,
+      timestamp,
+      isLoading
+    })
+  };
+  return deviceInfo;
+}
+async function getDeviceInfo() {
+  const [accessibilitySettings, statusBarHeight] = await Promise.all([
+    getAccessibilitySettings(),
+    getStatusBarHeight()
+  ]);
+  const colorScheme = Appearance.getColorScheme() ?? null;
+  return {
+    platform: getPlatformInfo(),
+    display: getDisplayInfo(),
+    accessibility: accessibilitySettings,
+    appearance: {
+      colorScheme,
+      prefersDarkMode: colorScheme === "dark"
+    },
+    locale: getLocaleInfo(),
+    statusBar: {
+      height: statusBarHeight,
+      isVisible: true
+    },
+    keyboard: {
+      isVisible: false,
+      height: 0,
+      animationDuration: 0
+    },
+    appState: {
+      currentState: AppState.currentState,
+      isActive: AppState.currentState === "active"
+    },
+    identifiers: getUniqueIdentifiers(),
+    settings: getSettingsInfo(),
+    timestamp: Date.now(),
+    isLoading: false
+  };
+}
+function logDeviceInfo(info) {
+  console.log("\n========================================");
+  console.log("       DEVICE INFO REPORT");
+  console.log("========================================\n");
+  console.log("--- PLATFORM ---");
+  console.log(JSON.stringify(info.platform, null, 2));
+  console.log("\n--- DISPLAY ---");
+  console.log(JSON.stringify(info.display, null, 2));
+  console.log("\n--- ACCESSIBILITY ---");
+  console.log(JSON.stringify(info.accessibility, null, 2));
+  console.log("\n--- APPEARANCE ---");
+  console.log(JSON.stringify(info.appearance, null, 2));
+  console.log("\n--- LOCALE ---");
+  console.log(JSON.stringify(info.locale, null, 2));
+  console.log("\n--- STATUS BAR ---");
+  console.log(JSON.stringify(info.statusBar, null, 2));
+  console.log("\n--- KEYBOARD ---");
+  console.log(JSON.stringify(info.keyboard, null, 2));
+  console.log("\n--- APP STATE ---");
+  console.log(JSON.stringify(info.appState, null, 2));
+  console.log("\n--- IDENTIFIERS ---");
+  console.log(JSON.stringify(info.identifiers, null, 2));
+  console.log("\n--- SETTINGS ---");
+  const settingsKeys = Object.keys(info.settings.userDefaults ?? {});
+  console.log(`userDefaults: ${settingsKeys.length} keys`);
+  if (settingsKeys.length > 0 && settingsKeys.length <= 20) {
+    console.log(JSON.stringify(info.settings, null, 2));
+  }
+  console.log("\n--- METADATA ---");
+  console.log(`timestamp: ${info.timestamp}`);
+  console.log(`isLoading: ${info.isLoading}`);
+  console.log("\n========================================\n");
+}
+
+export {
+  usePersistedState,
+  resetPersistedStateCache,
+  useChangeLog,
+  useSubscribedValue,
+  useEventStoreEvents,
+  useDeviceInfo,
+  getDeviceInfo,
+  logDeviceInfo
+};