React: Remove npm dependency for Warning package

example/react/package.json

@@ -4,15 +4,14 @@
   "version": "0.0.1",
   "type": "module",
   "scripts": {
-    "dev": "vite",
+    "dev": "vite --force",
     "build": "vite build",
     "lint": "eslint . --ext js,jsx --report-unused-disable-directives --max-warnings 0",
     "preview": "vite preview"
   },
   "dependencies": {
-    "@iframe-resizer/child": "^5.2.3",
-    "@iframe-resizer/core": "^5.2.3",
-    "@iframe-resizer/react": "^5.2.3",
+    "@iframe-resizer/child": "^5.3.0-beta.1",
+    "@iframe-resizer/react": "^5.3.0-beta.1",
     "react": "^18.3.1",
     "react-dom": "^18.3.1"
   },
@@ -26,4 +25,4 @@
     "eslint-plugin-react-refresh": "^0.4.9",
     "vite": "^5.3.5"
   }
-}
+}

example/react/src/App.jsx

@@ -8,6 +8,7 @@ import './App.css'
 function App() {
   const iframeRef = useRef(null)
   const [messageData, setMessageData] = useState()
+  const [show, setShow] = useState(true)
 
   const onResized = (data) => setMessageData(data)
 
@@ -20,17 +21,23 @@ function App() {
   return (
     <>
       <h2>@iframe-resizer/react example</h2>
-      <IframeResizer
-        license="GPLv3"
-        log
-        forwardRef={iframeRef}
-        inPageLinks
-        onMessage={onMessage}
-        onResized={onResized}
-        src="child/frame.content.html"
-        style={{ width: '100%', height: '100vh'}}
-      />
-      <MessageData data={messageData} />
+      <button onClick={() => setShow(!show)}>{show ? 'Hide' : 'Show'}</button>
+      {show &&
+        <>
+          <IframeResizer
+            license="GPLv3"
+            log
+            forwardRef={iframeRef}
+            inPageLinks
+            onMessage={onMessage}
+            onResized={onResized}
+            src="child/frame.content.html"
+            style={{ width: '100%', height: '100vh' }}
+          />
+
+          <MessageData data={messageData} />
+        </>
+      }
     </>
   )
 }

packages/core/index.js

@@ -689,8 +689,9 @@ function chkEvent(iframeId, funcName, val) {
 }
 
 function removeIframeListeners(iframe) {
-  const iframeId = iframe.id
-  delete settings[iframeId]
+  const { id } = iframe
+  delete settings[id]
+  log(id, 'Disconnected from iframe')
 }
 
 function closeIFrame(iframe) {

packages/react/index.jsx

@@ -1,21 +1,21 @@
 import connectResizer from '@iframe-resizer/core'
 import React, { useEffect, useImperativeHandle, useRef } from 'react'
-import warning from 'warning'
 
 import filterIframeAttribs from '../common/filter-iframe-attribs'
 
+// TODO: Add support for React.forwardRef() in next major version (Breaking change)
 function IframeResizer(props) {
   // eslint-disable-next-line react/prop-types
-  const { title, forwardRef, ...rest } = props
+  const { forwardRef, ...rest } = props
   const filteredProps = filterIframeAttribs(rest)
   const iframeRef = useRef(null)
 
   const onClose = () => {
-    warning(
-      !iframeRef.current,
+    console.warn(
       `[iframe-resizer/react][${iframeRef?.current?.id}] Close event ignored, to remove the iframe update your React component.`,
     )
-    return !iframeRef.current // Allow React to close this
+
+    return false
   }
 
   // This hook is only run once, as once iframe-resizer is bound, it will
@@ -37,7 +37,8 @@ function IframeResizer(props) {
     },
   }))
 
-  return <iframe title={title} {...filteredProps} ref={iframeRef} />
+  // eslint-disable-next-line jsx-a11y/iframe-has-title
+  return <iframe {...filteredProps} ref={iframeRef} />
 }
 
 export default IframeResizer

rollup.config.mjs

@@ -206,7 +206,7 @@ const npm = [
   {
     input: 'packages/react/index.jsx',
     output: [output('react')('esm'), output('react')('cjs')],
-    external: ['@iframe-resizer/core', 'react', 'warning', /@babel\/runtime/],
+    external: ['@iframe-resizer/core', 'react', /@babel\/runtime/],
     plugins: [
       ...pluginsProd('react'),
       copy({