diff --git a/.changeset/stupid-walls-tap.md b/.changeset/stupid-walls-tap.md new file mode 100644 index 00000000..b8072d54 --- /dev/null +++ b/.changeset/stupid-walls-tap.md @@ -0,0 +1,5 @@ +--- +'leva': patch +--- + +fix(Leva): disable dev warning diff --git a/packages/leva/src/components/Leva/Leva.tsx b/packages/leva/src/components/Leva/Leva.tsx index 4e30069d..97de0a31 100644 --- a/packages/leva/src/components/Leva/Leva.tsx +++ b/packages/leva/src/components/Leva/Leva.tsx @@ -1,7 +1,7 @@ import React, { useEffect } from 'react' -import ReactDOM from 'react-dom' import { levaStore } from '../../store' import { LevaRoot, LevaRootProps } from './LevaRoot' +import { render } from '../../utils/react' let rootInitialized = false let rootEl: HTMLElement | null = null @@ -40,7 +40,7 @@ export function useRenderRoot(isGlobalPanel: boolean) { document.getElementById('leva__root') || Object.assign(document.createElement('div'), { id: 'leva__root' }) if (document.body) { document.body.appendChild(rootEl) - ReactDOM.render(, rootEl) + render(, rootEl) } } rootInitialized = true diff --git a/packages/leva/src/utils/react.ts b/packages/leva/src/utils/react.ts index f4f93a11..a1ee19eb 100644 --- a/packages/leva/src/utils/react.ts +++ b/packages/leva/src/utils/react.ts @@ -1,4 +1,20 @@ import React from 'react' +import ReactDOM from 'react-dom' + +/** + * With React 18, renderers will warn when not using the new createRoot signature to opt-in to concurrent mode. + * We're okay with creating a (blocking) legacy root to support older versions, so we disable the warning. + * @see https://github.com/facebook/react/pull/21652 + */ +export function render

(element: React.ReactElement

, container: HTMLElement): void { + // eslint-disable-next-line no-console + const error = console.error + // eslint-disable-next-line no-console + console.error = () => {} + ReactDOM.render(element, container) + // eslint-disable-next-line no-console + console.error = error +} /* * https://github.com/gregberge/react-merge-refs