diff --git a/packages/react-dom/src/client/ReactDOM.js b/packages/react-dom/src/client/ReactDOM.js index 85816bb300c2..1db9e527efe1 100644 --- a/packages/react-dom/src/client/ReactDOM.js +++ b/packages/react-dom/src/client/ReactDOM.js @@ -42,7 +42,6 @@ import { } from 'react-reconciler/inline.dom'; import {createPortal as createPortalImpl} from 'shared/ReactPortal'; import {canUseDOM} from 'shared/ExecutionEnvironment'; -import createEvent from 'shared/createEventComponent'; import {setBatchingImplementation} from 'events/ReactGenericBatching'; import { setRestoreImplementation, @@ -64,10 +63,7 @@ import getComponentName from 'shared/getComponentName'; import invariant from 'shared/invariant'; import lowPriorityWarning from 'shared/lowPriorityWarning'; import warningWithoutStack from 'shared/warningWithoutStack'; -import { - enableStableConcurrentModeAPIs, - enableEventAPI, -} from 'shared/ReactFeatureFlags'; +import {enableStableConcurrentModeAPIs} from 'shared/ReactFeatureFlags'; import { getInstanceFromNode, @@ -881,10 +877,6 @@ if (enableStableConcurrentModeAPIs) { ReactDOM.createSyncRoot = createSyncRoot; } -if (enableEventAPI) { - ReactDOM.unstable_createEvent = createEvent; -} - const foundDevTools = injectIntoDevTools({ findFiberByHostInstance: getClosestInstanceFromNode, bundleType: __DEV__ ? 1 : 0, diff --git a/packages/react-dom/src/events/__tests__/DOMEventResponderSystem-test.internal.js b/packages/react-dom/src/events/__tests__/DOMEventResponderSystem-test.internal.js index 913fad013290..edd849fb7132 100644 --- a/packages/react-dom/src/events/__tests__/DOMEventResponderSystem-test.internal.js +++ b/packages/react-dom/src/events/__tests__/DOMEventResponderSystem-test.internal.js @@ -45,7 +45,7 @@ function createReactEventComponent({ allowEventHooks: allowEventHooks || true, }; - return ReactDOM.unstable_createEvent(testEventResponder); + return React.unstable_createEvent(testEventResponder); } const createEvent = (type, data) => { diff --git a/packages/react-dom/src/fire/ReactFire.js b/packages/react-dom/src/fire/ReactFire.js index d0af74edb2ac..bb74931fdc3e 100644 --- a/packages/react-dom/src/fire/ReactFire.js +++ b/packages/react-dom/src/fire/ReactFire.js @@ -70,7 +70,6 @@ import invariant from 'shared/invariant'; import lowPriorityWarning from 'shared/lowPriorityWarning'; import warningWithoutStack from 'shared/warningWithoutStack'; import {enableStableConcurrentModeAPIs} from 'shared/ReactFeatureFlags'; -import createEvent from 'shared/createEventComponent'; import { getInstanceFromNode, @@ -87,7 +86,6 @@ import { DOCUMENT_FRAGMENT_NODE, } from '../shared/HTMLNodeType'; import {ROOT_ATTRIBUTE_NAME} from '../shared/DOMProperty'; -import {enableEventAPI} from 'shared/ReactFeatureFlags'; const ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner; @@ -885,10 +883,6 @@ if (enableStableConcurrentModeAPIs) { ReactDOM.createSyncRoot = createSyncRoot; } -if (enableEventAPI) { - ReactDOM.unstable_createEvent = createEvent; -} - const foundDevTools = injectIntoDevTools({ findFiberByHostInstance: getClosestInstanceFromNode, bundleType: __DEV__ ? 1 : 0, diff --git a/packages/react-events/README.md b/packages/react-events/README.md index 0e02720951c4..9e7b5e4390b2 100644 --- a/packages/react-events/README.md +++ b/packages/react-events/README.md @@ -12,10 +12,10 @@ can be found [here](./docs). ## EventComponent -An Event Component is defined using `ReactDOM.unstable_createEvent`: +An Event Component is defined using `React.unstable_createEvent`: ```js -const EventComponent = ReactDOM.unstable_createEvent( +const EventComponent = React.unstable_createEvent( responder: EventResponder, displayName: string ); diff --git a/packages/react-events/src/Drag.js b/packages/react-events/src/Drag.js index 309143c09ada..ebe489b27997 100644 --- a/packages/react-events/src/Drag.js +++ b/packages/react-events/src/Drag.js @@ -13,7 +13,7 @@ import type { } from 'shared/ReactDOMTypes'; import type {EventPriority} from 'shared/ReactTypes'; -import ReactDOM from 'react-dom'; +import React from 'react'; import {DiscreteEvent, UserBlockingEvent} from 'shared/ReactTypes'; const targetEventTypes = ['pointerdown']; @@ -261,4 +261,4 @@ const DragResponder = { }, }; -export default ReactDOM.unstable_createEvent(DragResponder); +export default React.unstable_createEvent(DragResponder); diff --git a/packages/react-events/src/Focus.js b/packages/react-events/src/Focus.js index efc6d2ca0152..6f80e48221e4 100644 --- a/packages/react-events/src/Focus.js +++ b/packages/react-events/src/Focus.js @@ -13,7 +13,7 @@ import type { PointerType, } from 'shared/ReactDOMTypes'; -import ReactDOM from 'react-dom'; +import React from 'react'; import {DiscreteEvent} from 'shared/ReactTypes'; type FocusProps = { @@ -338,4 +338,4 @@ const FocusResponder = { }, }; -export default ReactDOM.unstable_createEvent(FocusResponder); +export default React.unstable_createEvent(FocusResponder); diff --git a/packages/react-events/src/FocusScope.js b/packages/react-events/src/FocusScope.js index 05bdd17e5e90..2f6cf4cb25fb 100644 --- a/packages/react-events/src/FocusScope.js +++ b/packages/react-events/src/FocusScope.js @@ -11,7 +11,7 @@ import type { ReactDOMResponderContext, } from 'shared/ReactDOMTypes'; -import ReactDOM from 'react-dom'; +import React from 'react'; type FocusScopeProps = { autoFocus: Boolean, @@ -159,4 +159,4 @@ const FocusScopeResponder = { }, }; -export default ReactDOM.unstable_createEvent(FocusScopeResponder); +export default React.unstable_createEvent(FocusScopeResponder); diff --git a/packages/react-events/src/Hover.js b/packages/react-events/src/Hover.js index a407d8bc5566..23df751240ba 100644 --- a/packages/react-events/src/Hover.js +++ b/packages/react-events/src/Hover.js @@ -12,7 +12,7 @@ import type { ReactDOMResponderContext, } from 'shared/ReactDOMTypes'; -import ReactDOM from 'react-dom'; +import React from 'react'; import {UserBlockingEvent} from 'shared/ReactTypes'; type HoverProps = { @@ -408,4 +408,4 @@ const HoverResponder = { }, }; -export default ReactDOM.unstable_createEvent(HoverResponder); +export default React.unstable_createEvent(HoverResponder); diff --git a/packages/react-events/src/Press.js b/packages/react-events/src/Press.js index 336c95e6e96b..0b120519da42 100644 --- a/packages/react-events/src/Press.js +++ b/packages/react-events/src/Press.js @@ -14,7 +14,7 @@ import type { } from 'shared/ReactDOMTypes'; import type {EventPriority} from 'shared/ReactTypes'; -import ReactDOM from 'react-dom'; +import React from 'react'; import {DiscreteEvent, UserBlockingEvent} from 'shared/ReactTypes'; type PressProps = { @@ -981,4 +981,4 @@ const PressResponder = { }, }; -export default ReactDOM.unstable_createEvent(PressResponder); +export default React.unstable_createEvent(PressResponder); diff --git a/packages/react-events/src/Scroll.js b/packages/react-events/src/Scroll.js index c2c2c4c016ce..d66f9767031e 100644 --- a/packages/react-events/src/Scroll.js +++ b/packages/react-events/src/Scroll.js @@ -15,7 +15,7 @@ import type { import {UserBlockingEvent} from 'shared/ReactTypes'; import type {EventPriority} from 'shared/ReactTypes'; -import ReactDOM from 'react-dom'; +import React from 'react'; type ScrollProps = { disabled: boolean, @@ -213,4 +213,4 @@ const ScrollResponder = { }, }; -export default ReactDOM.unstable_createEvent(ScrollResponder); +export default React.unstable_createEvent(ScrollResponder); diff --git a/packages/react-events/src/Swipe.js b/packages/react-events/src/Swipe.js index ec0ee0102848..509cffd32486 100644 --- a/packages/react-events/src/Swipe.js +++ b/packages/react-events/src/Swipe.js @@ -13,7 +13,7 @@ import type { } from 'shared/ReactDOMTypes'; import type {EventPriority} from 'shared/ReactTypes'; -import ReactDOM from 'react-dom'; +import React from 'react'; import {UserBlockingEvent, DiscreteEvent} from 'shared/ReactTypes'; const targetEventTypes = ['pointerdown']; @@ -264,4 +264,4 @@ const SwipeResponder = { }, }; -export default ReactDOM.unstable_createEvent(SwipeResponder); +export default React.unstable_createEvent(SwipeResponder); diff --git a/packages/react/src/React.js b/packages/react/src/React.js index 95ba76ace2ed..ed1e5455a779 100644 --- a/packages/react/src/React.js +++ b/packages/react/src/React.js @@ -52,6 +52,7 @@ import { } from './ReactElementValidator'; import ReactSharedInternals from './ReactSharedInternals'; import {error, warn} from './withComponentStack'; +import createEvent from 'shared/createEventComponent'; import {enableJSXTransformAPI, enableEventAPI} from 'shared/ReactFeatureFlags'; const React = { Children: { @@ -103,6 +104,11 @@ const React = { __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED: ReactSharedInternals, }; +if (enableEventAPI) { + React.unstable_createEvent = createEvent; + React.unstable_useEvent = useEvent; +} + // Note: some APIs are added with feature flags. // Make sure that stable builds for open source // don't modify the React object to avoid deopts. @@ -121,8 +127,4 @@ if (enableJSXTransformAPI) { } } -if (enableEventAPI) { - React.unstable_useEvent = useEvent; -} - export default React; diff --git a/scripts/rollup/bundles.js b/scripts/rollup/bundles.js index c8233979aaa8..516eb21037b0 100644 --- a/scripts/rollup/bundles.js +++ b/scripts/rollup/bundles.js @@ -465,7 +465,7 @@ const bundles = [ moduleType: NON_FIBER_RENDERER, entry: 'react-events/press', global: 'ReactEventsPress', - externals: ['react-dom'], + externals: ['react'], }, { @@ -480,7 +480,7 @@ const bundles = [ moduleType: NON_FIBER_RENDERER, entry: 'react-events/hover', global: 'ReactEventsHover', - externals: ['react-dom'], + externals: ['react'], }, { @@ -495,7 +495,7 @@ const bundles = [ moduleType: NON_FIBER_RENDERER, entry: 'react-events/focus', global: 'ReactEventsFocus', - externals: ['react-dom'], + externals: ['react'], }, { @@ -510,7 +510,7 @@ const bundles = [ moduleType: NON_FIBER_RENDERER, entry: 'react-events/focus-scope', global: 'ReactEventsFocusScope', - externals: ['react-dom'], + externals: ['react'], }, { @@ -525,7 +525,7 @@ const bundles = [ moduleType: NON_FIBER_RENDERER, entry: 'react-events/swipe', global: 'ReactEventsSwipe', - externals: ['react-dom'], + externals: ['react'], }, { @@ -540,7 +540,7 @@ const bundles = [ moduleType: NON_FIBER_RENDERER, entry: 'react-events/drag', global: 'ReactEventsDrag', - externals: ['react-dom'], + externals: ['react'], }, { @@ -555,7 +555,7 @@ const bundles = [ moduleType: NON_FIBER_RENDERER, entry: 'react-events/scroll', global: 'ReactEventsScroll', - externals: ['react-dom'], + externals: ['react'], }, ];