@teambit/pubsub 0.0.657 → 0.0.660

package/dist/pubsub-context.d.ts

@@ -11,4 +11,4 @@ export declare function createProvider(pubSubContext: PubSubRegistry): ({ childr
     children: ReactNode;
 }) => JSX.Element;
 export declare function usePubSub(): PubSubRegistry | undefined;
-export declare function usePubSubIframe(ref: RefObject<HTMLIFrameElement>): void;
+export declare function usePubSubIframe(ref?: RefObject<HTMLIFrameElement>): void;

package/dist/pubsub-context.js

@@ -42,10 +42,10 @@ function usePubSub() {
 function usePubSubIframe(ref) {
   const pubSub = usePubSub();
   (0, _react().useEffect)(() => {
-    if (!ref.current || !pubSub) return () => {};
+    if (!(ref !== null && ref !== void 0 && ref.current) || !pubSub) return () => {};
     const destroyConnection = pubSub.connect(ref.current);
     return () => destroyConnection();
-  }, [ref.current, pubSub]);
+  }, [ref === null || ref === void 0 ? void 0 : ref.current, pubSub]);
 }
 
 //# sourceMappingURL=pubsub-context.js.map

package/dist/pubsub-context.js.map

@@ -1 +1 @@
-{"version":3,"sources":["pubsub-context.tsx"],"names":["pubsubRegistry","undefined","createProvider","pubSubContext","PubSubProvider","children","usePubSub","usePubSubIframe","ref","pubSub","current","destroyConnection","connect"],"mappings":";;;;;;;;;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;;;;;AAUO,MAAMA,cAAc,gBAAG,4BAA0CC,SAA1C,CAAvB;;;AAEA,SAASC,cAAT,CAAwBC,aAAxB,EAAuD;AAC5D,QAAMC,cAAc,GAAG,CAAC;AAAEC,IAAAA;AAAF,GAAD,kBACrB,+BAAC,cAAD,CAAgB,QAAhB;AAAyB,IAAA,KAAK,EAAEF;AAAhC,KAAgDE,QAAhD,CADF;;AAIA,SAAOD,cAAP;AACD;;AAEM,SAASE,SAAT,GAAqB;AAC1B,SAAO,yBAAWN,cAAX,CAAP;AACD;;AAEM,SAASO,eAAT,CAAyBC,GAAzB,EAA4D;AACjE,QAAMC,MAAM,GAAGH,SAAS,EAAxB;AAEA,0BAAU,MAAM;AACd,QAAI,CAACE,GAAG,CAACE,OAAL,IAAgB,CAACD,MAArB,EAA6B,OAAO,MAAM,CAAE,CAAf;AAE7B,UAAME,iBAAiB,GAAGF,MAAM,CAACG,OAAP,CAAeJ,GAAG,CAACE,OAAnB,CAA1B;AACA,WAAO,MAAMC,iBAAiB,EAA9B;AACD,GALD,EAKG,CAACH,GAAG,CAACE,OAAL,EAAcD,MAAd,CALH;AAMD","sourcesContent":["import React, { createContext, useContext, useEffect, RefObject, ReactNode } from 'react';\n\nexport interface PubSubRegistry {\n  /**\n   * starts a connection to an iframe child.\n   * Returns a destroy() function that will break the connection.\n   */\n  connect(ref: HTMLIFrameElement): () => void;\n}\n\nexport const pubsubRegistry = createContext<PubSubRegistry | undefined>(undefined);\n\nexport function createProvider(pubSubContext: PubSubRegistry) {\n  const PubSubProvider = ({ children }: { children: ReactNode }) => (\n    <pubsubRegistry.Provider value={pubSubContext}>{children}</pubsubRegistry.Provider>\n  );\n\n  return PubSubProvider;\n}\n\nexport function usePubSub() {\n  return useContext(pubsubRegistry);\n}\n\nexport function usePubSubIframe(ref: RefObject<HTMLIFrameElement>) {\n  const pubSub = usePubSub();\n\n  useEffect(() => {\n    if (!ref.current || !pubSub) return () => {};\n\n    const destroyConnection = pubSub.connect(ref.current);\n    return () => destroyConnection();\n  }, [ref.current, pubSub]);\n}\n"]}
+{"version":3,"sources":["pubsub-context.tsx"],"names":["pubsubRegistry","undefined","createProvider","pubSubContext","PubSubProvider","children","usePubSub","usePubSubIframe","ref","pubSub","current","destroyConnection","connect"],"mappings":";;;;;;;;;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;;;;;AAUO,MAAMA,cAAc,gBAAG,4BAA0CC,SAA1C,CAAvB;;;AAEA,SAASC,cAAT,CAAwBC,aAAxB,EAAuD;AAC5D,QAAMC,cAAc,GAAG,CAAC;AAAEC,IAAAA;AAAF,GAAD,kBACrB,+BAAC,cAAD,CAAgB,QAAhB;AAAyB,IAAA,KAAK,EAAEF;AAAhC,KAAgDE,QAAhD,CADF;;AAIA,SAAOD,cAAP;AACD;;AAEM,SAASE,SAAT,GAAqB;AAC1B,SAAO,yBAAWN,cAAX,CAAP;AACD;;AAEM,SAASO,eAAT,CAAyBC,GAAzB,EAA6D;AAClE,QAAMC,MAAM,GAAGH,SAAS,EAAxB;AAEA,0BAAU,MAAM;AACd,QAAI,EAACE,GAAD,aAACA,GAAD,eAACA,GAAG,CAAEE,OAAN,KAAiB,CAACD,MAAtB,EAA8B,OAAO,MAAM,CAAE,CAAf;AAE9B,UAAME,iBAAiB,GAAGF,MAAM,CAACG,OAAP,CAAeJ,GAAG,CAACE,OAAnB,CAA1B;AACA,WAAO,MAAMC,iBAAiB,EAA9B;AACD,GALD,EAKG,CAACH,GAAD,aAACA,GAAD,uBAACA,GAAG,CAAEE,OAAN,EAAeD,MAAf,CALH;AAMD","sourcesContent":["import React, { createContext, useContext, useEffect, RefObject, ReactNode } from 'react';\n\nexport interface PubSubRegistry {\n  /**\n   * starts a connection to an iframe child.\n   * Returns a destroy() function that will break the connection.\n   */\n  connect(ref: HTMLIFrameElement): () => void;\n}\n\nexport const pubsubRegistry = createContext<PubSubRegistry | undefined>(undefined);\n\nexport function createProvider(pubSubContext: PubSubRegistry) {\n  const PubSubProvider = ({ children }: { children: ReactNode }) => (\n    <pubsubRegistry.Provider value={pubSubContext}>{children}</pubsubRegistry.Provider>\n  );\n\n  return PubSubProvider;\n}\n\nexport function usePubSub() {\n  return useContext(pubsubRegistry);\n}\n\nexport function usePubSubIframe(ref?: RefObject<HTMLIFrameElement>) {\n  const pubSub = usePubSub();\n\n  useEffect(() => {\n    if (!ref?.current || !pubSub) return () => {};\n\n    const destroyConnection = pubSub.connect(ref.current);\n    return () => destroyConnection();\n  }, [ref?.current, pubSub]);\n}\n"]}

package/dist/pubsub.ui.runtime.js

@@ -100,11 +100,10 @@ class PubsubUI {
         methods: {
           pub: this.emitEvent
         }
-      }); // absorb valid errors like 'connection destroyed'
-
-      connection.promise.then(childConnection => this.childApi = childConnection).catch(() => {
+      });
+      connection.promise.then(childConnection => this.childApi = childConnection).catch(err => {
         // eslint-disable-next-line no-console
-        console.error('[Pubsub.ui]', 'failed connecting to child iframe');
+        console.error('[Pubsub.ui]', 'failed connecting to child iframe:', err);
       });
 
       const destroy = () => {

package/dist/pubsub.ui.runtime.js.map

@@ -1 +1 @@
-{"version":3,"sources":["pubsub.ui.runtime.ts"],"names":["PubsubUI","EventEmitter2","topic","callback","events","on","unSub","off","event","propagate","emitEvent","pubToChild","iframe","connection","methods","pub","promise","then","childConnection","childApi","catch","console","error","destroy","emit","provider","uiUI","pubsubUI","reactContext","connect","connectToIframe","registerRenderHooks","UIRuntime","UIAspect","PubsubAspect","addRuntime"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAGA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAWO,MAAMA,QAAN,CAAe;AAAA;AAAA;AAAA,oDAEH,KAAIC,6BAAJ,GAFG;AAAA,iDAOP,CAACC,KAAD,EAAgBC,QAAhB,KAAuC;AAClD,YAAMC,MAAM,GAAG,KAAKA,MAApB;AACAA,MAAAA,MAAM,CAACC,EAAP,CAAUH,KAAV,EAAiBC,QAAjB;;AAEA,YAAMG,KAAK,GAAG,MAAM;AAClBF,QAAAA,MAAM,CAACG,GAAP,CAAWL,KAAX,EAAkBC,QAAlB;AACD,OAFD;;AAIA,aAAOG,KAAP;AACD,KAhBmB;AAAA,iDAqBP,CAACJ,KAAD,EAAgBM,KAAhB,EAA0C;AAAEC,MAAAA;AAAF,QAA4B,EAAtE,KAA6E;AACxF,WAAKC,SAAL,CAAeR,KAAf,EAAsBM,KAAtB,EADwF,CAGxF;;AACA,UAAIC,SAAJ,EAAe;AACb,aAAKE,UAAL,CAAgBT,KAAhB,EAAuBM,KAAvB;AACD;AACF,KA5BmB;AAAA,6DA8BOI,MAAD,IAA+B;AACvD,YAAMC,UAAU,GAAG,8BAA6B;AAC9CD,QAAAA,MAD8C;AAE9CE,QAAAA,OAAO,EAAE;AACPC,UAAAA,GAAG,EAAE,KAAKL;AADH;AAFqC,OAA7B,CAAnB,CADuD,CAQvD;;AACAG,MAAAA,UAAU,CAACG,OAAX,CACGC,IADH,CACSC,eAAD,IAAsB,KAAKC,QAAL,GAAgBD,eAD9C,EAEGE,KAFH,CAES,MAAM;AACX;AACAC,QAAAA,OAAO,CAACC,KAAR,CAAc,aAAd,EAA6B,mCAA7B;AACD,OALH;;AAOA,YAAMC,OAAO,GAAG,MAAM;AACpBV,QAAAA,UAAU,IAAIA,UAAU,CAACU,OAAX,EAAd;AACD,OAFD;;AAGA,aAAOA,OAAP;AACD,KAlDmB;AAAA,uDAuDA,CAACrB,KAAD,EAAgBM,KAAhB,KAA6C;AAC/D,WAAKJ,MAAL,CAAYoB,IAAZ,CAAiBtB,KAAjB,EAAwBM,KAAxB;AACD,KAzDmB;AAAA,wDA8DC,CAACN,KAAD,EAAgBM,KAAhB,KAA6C;AAAA;;AAChE,+BAAO,KAAKW,QAAZ,mDAAO,eAAeJ,GAAf,CAAmBb,KAAnB,EAA0BM,KAA1B,CAAP;AACD,KAhEmB;AAAA;;AAqEC,eAARiB,QAAQ,CAAC,CAACC,IAAD,CAAD,EAAiB;AACpC,UAAMC,QAAQ,GAAG,IAAI3B,QAAJ,EAAjB;AAEA,UAAM4B,YAAY,GAAG,qCAAe;AAClCC,MAAAA,OAAO,EAAEF,QAAQ,CAACG;AADgB,KAAf,CAArB;AAIAJ,IAAAA,IAAI,CAACK,mBAAL,CAAyB;AAAEH,MAAAA;AAAF,KAAzB;AAEA,WAAOD,QAAP;AACD;;AA/EmB;;;gCAAT3B,Q,aAkEMgC,e;gCAlENhC,Q,kBAmEW,CAACiC,cAAD,C;;AAexBC,uBAAaC,UAAb,CAAwBnC,QAAxB","sourcesContent":["import { UIRuntime, UIAspect, UiUI } from '@teambit/ui';\nimport { EventEmitter2 } from 'eventemitter2';\nimport { connectToChild } from 'penpal';\nimport type { AsyncMethodReturns } from 'penpal/lib/types';\nimport { BitBaseEvent } from './bit-base-event';\nimport { PubsubAspect } from './pubsub.aspect';\nimport { createProvider } from './pubsub-context';\nimport { Callback } from './types';\n\ntype PubOptions = {\n  /** forward the event to adjacent windows (including the preview iframe)  */\n  propagate?: boolean;\n};\n\ntype ChildMethods = {\n  pub: (topic: string, event: BitBaseEvent<any>) => any;\n};\nexport class PubsubUI {\n  private childApi?: AsyncMethodReturns<ChildMethods>;\n  private events = new EventEmitter2();\n\n  /**\n   * subscribe to events\n   */\n  public sub = (topic: string, callback: Callback) => {\n    const events = this.events;\n    events.on(topic, callback);\n\n    const unSub = () => {\n      events.off(topic, callback);\n    };\n\n    return unSub;\n  };\n\n  /**\n   * publish event to all subscribers, including nested iframes.\n   */\n  public pub = (topic: string, event: BitBaseEvent<any>, { propagate }: PubOptions = {}) => {\n    this.emitEvent(topic, event);\n\n    // opt-in to forward to iframe, as we would not want 'private' messages automatically passing to iframe\n    if (propagate) {\n      this.pubToChild(topic, event);\n    }\n  };\n\n  private connectToIframe = (iframe: HTMLIFrameElement) => {\n    const connection = connectToChild<ChildMethods>({\n      iframe,\n      methods: {\n        pub: this.emitEvent,\n      },\n    });\n\n    // absorb valid errors like 'connection destroyed'\n    connection.promise\n      .then((childConnection) => (this.childApi = childConnection))\n      .catch(() => {\n        // eslint-disable-next-line no-console\n        console.error('[Pubsub.ui]', 'failed connecting to child iframe');\n      });\n\n    const destroy = () => {\n      connection && connection.destroy();\n    };\n    return destroy;\n  };\n\n  /**\n   * publish event to all subscribers in this window\n   */\n  private emitEvent = (topic: string, event: BitBaseEvent<any>) => {\n    this.events.emit(topic, event);\n  };\n\n  /**\n   * publish event to nested iframes\n   */\n  private pubToChild = (topic: string, event: BitBaseEvent<any>) => {\n    return this.childApi?.pub(topic, event);\n  };\n\n  static runtime = UIRuntime;\n  static dependencies = [UIAspect];\n\n  static async provider([uiUI]: [UiUI]) {\n    const pubsubUI = new PubsubUI();\n\n    const reactContext = createProvider({\n      connect: pubsubUI.connectToIframe,\n    });\n\n    uiUI.registerRenderHooks({ reactContext });\n\n    return pubsubUI;\n  }\n}\n\nPubsubAspect.addRuntime(PubsubUI);\n"]}
+{"version":3,"sources":["pubsub.ui.runtime.ts"],"names":["PubsubUI","EventEmitter2","topic","callback","events","on","unSub","off","event","propagate","emitEvent","pubToChild","iframe","connection","methods","pub","promise","then","childConnection","childApi","catch","err","console","error","destroy","emit","provider","uiUI","pubsubUI","reactContext","connect","connectToIframe","registerRenderHooks","UIRuntime","UIAspect","PubsubAspect","addRuntime"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAGA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAWO,MAAMA,QAAN,CAAe;AAAA;AAAA;AAAA,oDAEH,KAAIC,6BAAJ,GAFG;AAAA,iDAOP,CAACC,KAAD,EAAgBC,QAAhB,KAAuC;AAClD,YAAMC,MAAM,GAAG,KAAKA,MAApB;AACAA,MAAAA,MAAM,CAACC,EAAP,CAAUH,KAAV,EAAiBC,QAAjB;;AAEA,YAAMG,KAAK,GAAG,MAAM;AAClBF,QAAAA,MAAM,CAACG,GAAP,CAAWL,KAAX,EAAkBC,QAAlB;AACD,OAFD;;AAIA,aAAOG,KAAP;AACD,KAhBmB;AAAA,iDAqBP,CAACJ,KAAD,EAAgBM,KAAhB,EAA0C;AAAEC,MAAAA;AAAF,QAA4B,EAAtE,KAA6E;AACxF,WAAKC,SAAL,CAAeR,KAAf,EAAsBM,KAAtB,EADwF,CAGxF;;AACA,UAAIC,SAAJ,EAAe;AACb,aAAKE,UAAL,CAAgBT,KAAhB,EAAuBM,KAAvB;AACD;AACF,KA5BmB;AAAA,6DA8BOI,MAAD,IAA+B;AACvD,YAAMC,UAAU,GAAG,8BAA6B;AAC9CD,QAAAA,MAD8C;AAE9CE,QAAAA,OAAO,EAAE;AACPC,UAAAA,GAAG,EAAE,KAAKL;AADH;AAFqC,OAA7B,CAAnB;AAOAG,MAAAA,UAAU,CAACG,OAAX,CACGC,IADH,CACSC,eAAD,IAAsB,KAAKC,QAAL,GAAgBD,eAD9C,EAEGE,KAFH,CAEUC,GAAD,IAAS;AACd;AACAC,QAAAA,OAAO,CAACC,KAAR,CAAc,aAAd,EAA6B,oCAA7B,EAAmEF,GAAnE;AACD,OALH;;AAOA,YAAMG,OAAO,GAAG,MAAM;AACpBX,QAAAA,UAAU,IAAIA,UAAU,CAACW,OAAX,EAAd;AACD,OAFD;;AAGA,aAAOA,OAAP;AACD,KAjDmB;AAAA,uDAsDA,CAACtB,KAAD,EAAgBM,KAAhB,KAA6C;AAC/D,WAAKJ,MAAL,CAAYqB,IAAZ,CAAiBvB,KAAjB,EAAwBM,KAAxB;AACD,KAxDmB;AAAA,wDA6DC,CAACN,KAAD,EAAgBM,KAAhB,KAA6C;AAAA;;AAChE,+BAAO,KAAKW,QAAZ,mDAAO,eAAeJ,GAAf,CAAmBb,KAAnB,EAA0BM,KAA1B,CAAP;AACD,KA/DmB;AAAA;;AAoEC,eAARkB,QAAQ,CAAC,CAACC,IAAD,CAAD,EAAiB;AACpC,UAAMC,QAAQ,GAAG,IAAI5B,QAAJ,EAAjB;AAEA,UAAM6B,YAAY,GAAG,qCAAe;AAClCC,MAAAA,OAAO,EAAEF,QAAQ,CAACG;AADgB,KAAf,CAArB;AAIAJ,IAAAA,IAAI,CAACK,mBAAL,CAAyB;AAAEH,MAAAA;AAAF,KAAzB;AAEA,WAAOD,QAAP;AACD;;AA9EmB;;;gCAAT5B,Q,aAiEMiC,e;gCAjENjC,Q,kBAkEW,CAACkC,cAAD,C;;AAexBC,uBAAaC,UAAb,CAAwBpC,QAAxB","sourcesContent":["import { UIRuntime, UIAspect, UiUI } from '@teambit/ui';\nimport { EventEmitter2 } from 'eventemitter2';\nimport { connectToChild } from 'penpal';\nimport type { AsyncMethodReturns } from 'penpal/lib/types';\nimport { BitBaseEvent } from './bit-base-event';\nimport { PubsubAspect } from './pubsub.aspect';\nimport { createProvider } from './pubsub-context';\nimport { Callback } from './types';\n\ntype PubOptions = {\n  /** forward the event to adjacent windows (including the preview iframe)  */\n  propagate?: boolean;\n};\n\ntype ChildMethods = {\n  pub: (topic: string, event: BitBaseEvent<any>) => any;\n};\nexport class PubsubUI {\n  private childApi?: AsyncMethodReturns<ChildMethods>;\n  private events = new EventEmitter2();\n\n  /**\n   * subscribe to events\n   */\n  public sub = (topic: string, callback: Callback) => {\n    const events = this.events;\n    events.on(topic, callback);\n\n    const unSub = () => {\n      events.off(topic, callback);\n    };\n\n    return unSub;\n  };\n\n  /**\n   * publish event to all subscribers, including nested iframes.\n   */\n  public pub = (topic: string, event: BitBaseEvent<any>, { propagate }: PubOptions = {}) => {\n    this.emitEvent(topic, event);\n\n    // opt-in to forward to iframe, as we would not want 'private' messages automatically passing to iframe\n    if (propagate) {\n      this.pubToChild(topic, event);\n    }\n  };\n\n  private connectToIframe = (iframe: HTMLIFrameElement) => {\n    const connection = connectToChild<ChildMethods>({\n      iframe,\n      methods: {\n        pub: this.emitEvent,\n      },\n    });\n\n    connection.promise\n      .then((childConnection) => (this.childApi = childConnection))\n      .catch((err) => {\n        // eslint-disable-next-line no-console\n        console.error('[Pubsub.ui]', 'failed connecting to child iframe:', err);\n      });\n\n    const destroy = () => {\n      connection && connection.destroy();\n    };\n    return destroy;\n  };\n\n  /**\n   * publish event to all subscribers in this window\n   */\n  private emitEvent = (topic: string, event: BitBaseEvent<any>) => {\n    this.events.emit(topic, event);\n  };\n\n  /**\n   * publish event to nested iframes\n   */\n  private pubToChild = (topic: string, event: BitBaseEvent<any>) => {\n    return this.childApi?.pub(topic, event);\n  };\n\n  static runtime = UIRuntime;\n  static dependencies = [UIAspect];\n\n  static async provider([uiUI]: [UiUI]) {\n    const pubsubUI = new PubsubUI();\n\n    const reactContext = createProvider({\n      connect: pubsubUI.connectToIframe,\n    });\n\n    uiUI.registerRenderHooks({ reactContext });\n\n    return pubsubUI;\n  }\n}\n\nPubsubAspect.addRuntime(PubsubUI);\n"]}

package/package.json

@@ -1,23 +1,23 @@
 {
   "name": "@teambit/pubsub",
-  "version": "0.0.657",
+  "version": "0.0.660",
   "homepage": "https://bit.dev/teambit/harmony/pubsub",
   "main": "dist/index.js",
   "componentId": {
     "scope": "teambit.harmony",
     "name": "pubsub",
-    "version": "0.0.657"
+    "version": "0.0.660"
   },
   "dependencies": {
     "@teambit/harmony": "0.2.11",
     "eventemitter2": "6.4.4",
-    "penpal": "5.3.0",
+    "penpal": "6.2.1",
     "@babel/runtime": "7.12.18",
     "core-js": "^3.0.0",
-    "@teambit/cli": "0.0.448",
-    "@teambit/preview": "0.0.657",
+    "@teambit/cli": "0.0.449",
+    "@teambit/preview": "0.0.660",
     "@teambit/ui-foundation.ui.is-browser": "0.0.486",
-    "@teambit/ui": "0.0.657"
+    "@teambit/ui": "0.0.660"
   },
   "devDependencies": {
     "@types/react": "^17.0.8",
@@ -28,7 +28,7 @@
     "@types/node": "12.20.4"
   },
   "peerDependencies": {
-    "@teambit/legacy": "1.0.227",
+    "@teambit/legacy": "1.0.228",
     "react-dom": "^16.8.0 || ^17.0.0",
     "react": "^16.8.0 || ^17.0.0"
   },
@@ -56,7 +56,7 @@
         "react": "-"
       },
       "peerDependencies": {
-        "@teambit/legacy": "1.0.227",
+        "@teambit/legacy": "1.0.228",
         "react-dom": "^16.8.0 || ^17.0.0",
         "react": "^16.8.0 || ^17.0.0"
       }

package/pubsub-context.tsx

@@ -22,13 +22,13 @@ export function usePubSub() {
   return useContext(pubsubRegistry);
 }
 
-export function usePubSubIframe(ref: RefObject<HTMLIFrameElement>) {
+export function usePubSubIframe(ref?: RefObject<HTMLIFrameElement>) {
   const pubSub = usePubSub();
 
   useEffect(() => {
-    if (!ref.current || !pubSub) return () => {};
+    if (!ref?.current || !pubSub) return () => {};
 
     const destroyConnection = pubSub.connect(ref.current);
     return () => destroyConnection();
-  }, [ref.current, pubSub]);
+  }, [ref?.current, pubSub]);
 }