@open-game-system/app-bridge-react/dist/index.js

React hooks and components for the app-bridge ecosystem

"use strict";
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);

// src/index.tsx
var src_exports = {};
__export(src_exports, {
  createBridgeContext: () => createBridgeContext
});
module.exports = __toCommonJS(src_exports);
var import_react = require("react");
var import_jsx_runtime = require("react/jsx-runtime");
function createBridgeContext() {
  const throwBridge = new Proxy({}, {
    get() {
      throw new Error(
        "Bridge not found in context. Did you forget to wrap your app in <BridgeContext.Provider bridge={...}>?"
      );
    }
  });
  const BridgeContext = (0, import_react.createContext)({
    bridge: throwBridge
  });
  const Provider = (0, import_react.memo)(
    ({
      children,
      bridge
    }) => {
      const value = (0, import_react.useMemo)(() => ({ bridge }), [bridge]);
      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(BridgeContext.Provider, { value, children });
    }
  );
  Provider.displayName = "BridgeProvider";
  function useBridge() {
    const context = (0, import_react.useContext)(BridgeContext);
    return context.bridge;
  }
  function createStoreContext(storeKey) {
    const throwStore = new Proxy({}, {
      get() {
        throw new Error(
          `Store "${String(storeKey)}" is not available. Make sure to use the store hooks inside a StoreContext.Provider.`
        );
      }
    });
    const StoreContext = (0, import_react.createContext)(throwStore);
    StoreContext.displayName = `Store<${String(storeKey)}>`;
    const Provider2 = (0, import_react.memo)(({ children }) => {
      const bridge = useBridge();
      const getStore = (0, import_react.useCallback)(() => {
        return bridge.getStore(storeKey) || null;
      }, [bridge]);
      const subscribe = (0, import_react.useCallback)((callback) => {
        return bridge.subscribe(callback);
      }, [bridge]);
      const store = (0, import_react.useSyncExternalStore)(
        subscribe,
        getStore,
        getStore
        // Same for server
      );
      if (!store)
        return null;
      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StoreContext.Provider, { value: store, children });
    });
    Provider2.displayName = `Store.Provider<${String(storeKey)}>`;
    const Loading = (0, import_react.memo)(({ children }) => {
      const bridge = useBridge();
      const isSupported = bridge.isSupported();
      const getStoreAvailability = (0, import_react.useCallback)(() => {
        return bridge.getStore(storeKey);
      }, [bridge]);
      const subscribe = (0, import_react.useCallback)((callback) => {
        return bridge.subscribe(callback);
      }, [bridge]);
      const store = (0, import_react.useSyncExternalStore)(
        subscribe,
        getStoreAvailability,
        getStoreAvailability
        // Same for server
      );
      return isSupported && !store ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children }) : null;
    });
    Loading.displayName = `Store.Loading<${String(storeKey)}>`;
    function useStore() {
      return (0, import_react.useContext)(StoreContext);
    }
    function useSelector(selector) {
      const store = useStore();
      const memoizedSelector = (0, import_react.useMemo)(() => selector, [selector]);
      return (0, import_react.useSyncExternalStore)(
        store.subscribe,
        () => memoizedSelector(store.getSnapshot()),
        () => memoizedSelector(store.getSnapshot())
        // Same for server
      );
    }
    return {
      Provider: Provider2,
      Loading,
      useStore,
      useSelector
    };
  }
  const Supported = (0, import_react.memo)(({ children }) => {
    const bridge = useBridge();
    const isSupported = bridge.isSupported();
    return isSupported ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children }) : null;
  });
  Supported.displayName = "BridgeSupported";
  const Unsupported = (0, import_react.memo)(({ children }) => {
    const bridge = useBridge();
    const isSupported = bridge.isSupported();
    return !isSupported ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children }) : null;
  });
  Unsupported.displayName = "BridgeUnsupported";
  return {
    Provider,
    createStoreContext,
    Supported,
    Unsupported
  };
}
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
  createBridgeContext
});
//# sourceMappingURL=index.js.map