From d035da1b53ab2d8578c1d1981d86fefef40ba6d5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Sebastian=20Markb=C3=A5ge?= Date: Mon, 19 Nov 2018 15:32:54 -0800 Subject: [PATCH] Remove `import * as` pattern from the codebase (#14282) Whenever we do this, Rollup needs to materialize this as an object. This causes it to also add the Babel compatibility property which is unnecessary bloat. However, since when we use these, we leak the object this often also deopts any compiler optimizations. If we really need an object we should export default an object. Currently there is an exception for DOMTopLevelEventTypes since listing out the imports is a PITA and it doesn't escape so it should get properly inlined. We should probably move to a different pattern to avoid this for consistency though. --- packages/react-art/src/ReactART.js | 16 +- packages/react-dom/src/client/ReactDOM.js | 144 +++++++++------- .../src/client/ReactDOMClientInjection.js | 10 +- .../react-dom/src/client/ReactDOMComponent.js | 160 +++++++++--------- packages/react-dom/src/client/ReactDOMFB.js | 24 ++- .../src/client/ReactDOMHostConfig.js | 17 +- .../react-dom/src/client/ReactDOMInput.js | 8 +- .../src/client/ReactInputSelection.js | 6 +- .../src/events/BeforeInputEventPlugin.js | 14 +- .../react-dom/src/events/ChangeEventPlugin.js | 8 +- .../react-dom/src/events/SelectEventPlugin.js | 7 +- .../src/test-utils/ReactTestUtils.js | 8 +- .../ReactDOMUnstableNativeDependencies.js | 4 +- .../src/NativeMethodsMixin.js | 7 +- .../react-native-renderer/src/ReactFabric.js | 45 ++--- .../src/ReactFabricHostConfig.js | 43 ++--- .../src/ReactFabricInjection.js | 16 +- .../src/ReactNativeBridgeEventPlugin.js | 10 +- .../src/ReactNativeComponent.js | 7 +- .../src/ReactNativeEventEmitter.js | 2 +- .../src/ReactNativeFiberHostComponent.js | 7 +- .../src/ReactNativeHostConfig.js | 38 ++--- .../src/ReactNativeInjection.js | 23 ++- .../src/ReactNativeInjectionShared.js | 6 +- .../src/ReactNativeRenderer.js | 54 +++--- .../src/createReactNoop.js | 4 +- .../src/ReactFiberBeginWork.js | 26 +-- .../src/ReactFiberClassComponent.js | 10 +- .../react-reconciler/src/ReactFiberContext.js | 10 +- .../src/ReactFiberReconciler.js | 25 +-- .../src/ReactFiberScheduler.js | 29 ++-- .../src/ReactFiberTreeReflection.js | 4 +- .../src/ReactTestHostConfig.js | 17 +- .../src/ReactTestRenderer.js | 48 ++++-- 34 files changed, 467 insertions(+), 390 deletions(-) diff --git a/packages/react-art/src/ReactART.js b/packages/react-art/src/ReactART.js index 472a55aff76c7..640a0448204bf 100644 --- a/packages/react-art/src/ReactART.js +++ b/packages/react-art/src/ReactART.js @@ -7,7 +7,11 @@ import React from 'react'; import ReactVersion from 'shared/ReactVersion'; -import * as ARTRenderer from 'react-reconciler/inline.art'; +import { + createContainer, + updateContainer, + injectIntoDevTools, +} from 'react-reconciler/inline.art'; import Transform from 'art/core/transform'; import Mode from 'art/modes/current'; import FastNoSideEffects from 'art/modes/fast-noSideEffects'; @@ -61,8 +65,8 @@ class Surface extends React.Component { this._surface = Mode.Surface(+width, +height, this._tagRef); - this._mountNode = ARTRenderer.createContainer(this._surface); - ARTRenderer.updateContainer(this.props.children, this._mountNode, this); + this._mountNode = createContainer(this._surface); + updateContainer(this.props.children, this._mountNode, this); } componentDidUpdate(prevProps, prevState) { @@ -72,7 +76,7 @@ class Surface extends React.Component { this._surface.resize(+props.width, +props.height); } - ARTRenderer.updateContainer(this.props.children, this._mountNode, this); + updateContainer(this.props.children, this._mountNode, this); if (this._surface.render) { this._surface.render(); @@ -80,7 +84,7 @@ class Surface extends React.Component { } componentWillUnmount() { - ARTRenderer.updateContainer(null, this._mountNode, this); + updateContainer(null, this._mountNode, this); } render() { @@ -132,7 +136,7 @@ class Text extends React.Component { } } -ARTRenderer.injectIntoDevTools({ +injectIntoDevTools({ findFiberByHostInstance: () => null, bundleType: __DEV__ ? 1 : 0, version: ReactVersion, diff --git a/packages/react-dom/src/client/ReactDOM.js b/packages/react-dom/src/client/ReactDOM.js index 4654358a10f80..8934a67be37b4 100644 --- a/packages/react-dom/src/client/ReactDOM.js +++ b/packages/react-dom/src/client/ReactDOM.js @@ -19,15 +19,42 @@ import type {Container} from './ReactDOMHostConfig'; import '../shared/checkReact'; import './ReactDOMClientInjection'; -import * as DOMRenderer from 'react-reconciler/inline.dom'; -import * as ReactPortal from 'shared/ReactPortal'; +import { + computeUniqueAsyncExpiration, + findHostInstanceWithNoPortals, + updateContainerAtExpirationTime, + flushRoot, + createContainer, + updateContainer, + batchedUpdates, + unbatchedUpdates, + interactiveUpdates, + flushInteractiveUpdates, + flushSync, + flushControlled, + injectIntoDevTools, + getPublicRootInstance, + findHostInstance, + findHostInstanceWithWarning, +} from 'react-reconciler/inline.dom'; +import {createPortal as createPortalImpl} from 'shared/ReactPortal'; import {canUseDOM} from 'shared/ExecutionEnvironment'; -import * as ReactGenericBatching from 'events/ReactGenericBatching'; -import * as ReactControlledComponent from 'events/ReactControlledComponent'; -import * as EventPluginHub from 'events/EventPluginHub'; -import * as EventPluginRegistry from 'events/EventPluginRegistry'; -import * as EventPropagators from 'events/EventPropagators'; -import * as ReactInstanceMap from 'shared/ReactInstanceMap'; +import {setBatchingImplementation} from 'events/ReactGenericBatching'; +import { + setRestoreImplementation, + enqueueStateRestore, + restoreStateIfNeeded, +} from 'events/ReactControlledComponent'; +import { + injection as EventPluginHubInjection, + runEventsInBatch, +} from 'events/EventPluginHub'; +import {eventNameDispatchConfigs} from 'events/EventPluginRegistry'; +import { + accumulateTwoPhaseDispatches, + accumulateDirectDispatches, +} from 'events/EventPropagators'; +import {has as hasInstance} from 'shared/ReactInstanceMap'; import ReactVersion from 'shared/ReactVersion'; import ReactSharedInternals from 'shared/ReactSharedInternals'; import getComponentName from 'shared/getComponentName'; @@ -36,9 +63,14 @@ import lowPriorityWarning from 'shared/lowPriorityWarning'; import warningWithoutStack from 'shared/warningWithoutStack'; import {enableStableConcurrentModeAPIs} from 'shared/ReactFeatureFlags'; -import * as ReactDOMComponentTree from './ReactDOMComponentTree'; +import { + getInstanceFromNode, + getNodeFromInstance, + getFiberCurrentPropsFromNode, + getClosestInstanceFromNode, +} from './ReactDOMComponentTree'; import {restoreControlledState} from './ReactDOMComponent'; -import * as ReactDOMEventListener from '../events/ReactDOMEventListener'; +import {dispatchEvent} from '../events/ReactDOMEventListener'; import { ELEMENT_NODE, COMMENT_NODE, @@ -74,7 +106,7 @@ if (__DEV__) { topLevelUpdateWarnings = (container: DOMContainer) => { if (container._reactRootContainer && container.nodeType !== COMMENT_NODE) { - const hostInstance = DOMRenderer.findHostInstanceWithNoPortals( + const hostInstance = findHostInstanceWithNoPortals( container._reactRootContainer._internalRoot.current, ); if (hostInstance) { @@ -90,9 +122,7 @@ if (__DEV__) { const isRootRenderedBySomeReact = !!container._reactRootContainer; const rootEl = getReactRootElementInContainer(container); - const hasNonRootReactChild = !!( - rootEl && ReactDOMComponentTree.getInstanceFromNode(rootEl) - ); + const hasNonRootReactChild = !!(rootEl && getInstanceFromNode(rootEl)); warningWithoutStack( !hasNonRootReactChild || isRootRenderedBySomeReact, @@ -125,7 +155,7 @@ if (__DEV__) { }; } -ReactControlledComponent.setRestoreImplementation(restoreControlledState); +setRestoreImplementation(restoreControlledState); export type DOMContainer = | (Element & { @@ -165,7 +195,7 @@ type Root = { }; function ReactBatch(root: ReactRoot) { - const expirationTime = DOMRenderer.computeUniqueAsyncExpiration(); + const expirationTime = computeUniqueAsyncExpiration(); this._expirationTime = expirationTime; this._root = root; this._next = null; @@ -185,7 +215,7 @@ ReactBatch.prototype.render = function(children: ReactNodeList) { const internalRoot = this._root._internalRoot; const expirationTime = this._expirationTime; const work = new ReactWork(); - DOMRenderer.updateContainerAtExpirationTime( + updateContainerAtExpirationTime( children, internalRoot, null, @@ -256,7 +286,7 @@ ReactBatch.prototype.commit = function() { // Synchronously flush all the work up to this batch's expiration time. this._defer = false; - DOMRenderer.flushRoot(internalRoot, expirationTime); + flushRoot(internalRoot, expirationTime); // Pop the batch from the list. const next = this._next; @@ -336,7 +366,7 @@ function ReactRoot( isConcurrent: boolean, hydrate: boolean, ) { - const root = DOMRenderer.createContainer(container, isConcurrent, hydrate); + const root = createContainer(container, isConcurrent, hydrate); this._internalRoot = root; } ReactRoot.prototype.render = function( @@ -352,7 +382,7 @@ ReactRoot.prototype.render = function( if (callback !== null) { work.then(callback); } - DOMRenderer.updateContainer(children, root, null, work._onCommit); + updateContainer(children, root, null, work._onCommit); return work; }; ReactRoot.prototype.unmount = function(callback: ?() => mixed): Work { @@ -365,7 +395,7 @@ ReactRoot.prototype.unmount = function(callback: ?() => mixed): Work { if (callback !== null) { work.then(callback); } - DOMRenderer.updateContainer(null, root, null, work._onCommit); + updateContainer(null, root, null, work._onCommit); return work; }; ReactRoot.prototype.legacy_renderSubtreeIntoContainer = function( @@ -382,7 +412,7 @@ ReactRoot.prototype.legacy_renderSubtreeIntoContainer = function( if (callback !== null) { work.then(callback); } - DOMRenderer.updateContainer(children, root, parentComponent, work._onCommit); + updateContainer(children, root, parentComponent, work._onCommit); return work; }; ReactRoot.prototype.createBatch = function(): Batch { @@ -453,10 +483,10 @@ function shouldHydrateDueToLegacyHeuristic(container) { ); } -ReactGenericBatching.setBatchingImplementation( - DOMRenderer.batchedUpdates, - DOMRenderer.interactiveUpdates, - DOMRenderer.flushInteractiveUpdates, +setBatchingImplementation( + batchedUpdates, + interactiveUpdates, + flushInteractiveUpdates, ); let warnedAboutHydrateAPI = false; @@ -535,12 +565,12 @@ function legacyRenderSubtreeIntoContainer( if (typeof callback === 'function') { const originalCallback = callback; callback = function() { - const instance = DOMRenderer.getPublicRootInstance(root._internalRoot); + const instance = getPublicRootInstance(root._internalRoot); originalCallback.call(instance); }; } // Initial mount should not be batched. - DOMRenderer.unbatchedUpdates(() => { + unbatchedUpdates(() => { if (parentComponent != null) { root.legacy_renderSubtreeIntoContainer( parentComponent, @@ -555,7 +585,7 @@ function legacyRenderSubtreeIntoContainer( if (typeof callback === 'function') { const originalCallback = callback; callback = function() { - const instance = DOMRenderer.getPublicRootInstance(root._internalRoot); + const instance = getPublicRootInstance(root._internalRoot); originalCallback.call(instance); }; } @@ -570,7 +600,7 @@ function legacyRenderSubtreeIntoContainer( root.render(children, callback); } } - return DOMRenderer.getPublicRootInstance(root._internalRoot); + return getPublicRootInstance(root._internalRoot); } function createPortal( @@ -583,7 +613,7 @@ function createPortal( 'Target container is not a DOM element.', ); // TODO: pass ReactDOM portal implementation as third argument - return ReactPortal.createPortal(children, container, null, key); + return createPortalImpl(children, container, null, key); } const ReactDOM: Object = { @@ -616,12 +646,9 @@ const ReactDOM: Object = { return (componentOrElement: any); } if (__DEV__) { - return DOMRenderer.findHostInstanceWithWarning( - componentOrElement, - 'findDOMNode', - ); + return findHostInstanceWithWarning(componentOrElement, 'findDOMNode'); } - return DOMRenderer.findHostInstance(componentOrElement); + return findHostInstance(componentOrElement); }, hydrate(element: React$Node, container: DOMContainer, callback: ?Function) { @@ -656,7 +683,7 @@ const ReactDOM: Object = { callback: ?Function, ) { invariant( - parentComponent != null && ReactInstanceMap.has(parentComponent), + parentComponent != null && hasInstance(parentComponent), 'parentComponent must be a valid React Component', ); return legacyRenderSubtreeIntoContainer( @@ -677,8 +704,7 @@ const ReactDOM: Object = { if (container._reactRootContainer) { if (__DEV__) { const rootEl = getReactRootElementInContainer(container); - const renderedByDifferentReact = - rootEl && !ReactDOMComponentTree.getInstanceFromNode(rootEl); + const renderedByDifferentReact = rootEl && !getInstanceFromNode(rootEl); warningWithoutStack( !renderedByDifferentReact, "unmountComponentAtNode(): The node you're attempting to unmount " + @@ -687,7 +713,7 @@ const ReactDOM: Object = { } // Unmount should not be batched. - DOMRenderer.unbatchedUpdates(() => { + unbatchedUpdates(() => { legacyRenderSubtreeIntoContainer(null, null, container, false, () => { container._reactRootContainer = null; }); @@ -698,9 +724,7 @@ const ReactDOM: Object = { } else { if (__DEV__) { const rootEl = getReactRootElementInContainer(container); - const hasNonRootReactChild = !!( - rootEl && ReactDOMComponentTree.getInstanceFromNode(rootEl) - ); + const hasNonRootReactChild = !!(rootEl && getInstanceFromNode(rootEl)); // Check if the container itself is a React root node. const isContainerReactRoot = @@ -740,29 +764,29 @@ const ReactDOM: Object = { return createPortal(...args); }, - unstable_batchedUpdates: DOMRenderer.batchedUpdates, + unstable_batchedUpdates: batchedUpdates, - unstable_interactiveUpdates: DOMRenderer.interactiveUpdates, + unstable_interactiveUpdates: interactiveUpdates, - flushSync: DOMRenderer.flushSync, + flushSync: flushSync, - unstable_flushControlled: DOMRenderer.flushControlled, + unstable_flushControlled: flushControlled, __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED: { // Keep in sync with ReactDOMUnstableNativeDependencies.js // and ReactTestUtils.js. This is an array for better minification. Events: [ - ReactDOMComponentTree.getInstanceFromNode, - ReactDOMComponentTree.getNodeFromInstance, - ReactDOMComponentTree.getFiberCurrentPropsFromNode, - EventPluginHub.injection.injectEventPluginsByName, - EventPluginRegistry.eventNameDispatchConfigs, - EventPropagators.accumulateTwoPhaseDispatches, - EventPropagators.accumulateDirectDispatches, - ReactControlledComponent.enqueueStateRestore, - ReactControlledComponent.restoreStateIfNeeded, - ReactDOMEventListener.dispatchEvent, - EventPluginHub.runEventsInBatch, + getInstanceFromNode, + getNodeFromInstance, + getFiberCurrentPropsFromNode, + EventPluginHubInjection.injectEventPluginsByName, + eventNameDispatchConfigs, + accumulateTwoPhaseDispatches, + accumulateDirectDispatches, + enqueueStateRestore, + restoreStateIfNeeded, + dispatchEvent, + runEventsInBatch, ], }, }; @@ -790,8 +814,8 @@ if (enableStableConcurrentModeAPIs) { ReactDOM.unstable_createRoot = createRoot; } -const foundDevTools = DOMRenderer.injectIntoDevTools({ - findFiberByHostInstance: ReactDOMComponentTree.getClosestInstanceFromNode, +const foundDevTools = injectIntoDevTools({ + findFiberByHostInstance: getClosestInstanceFromNode, bundleType: __DEV__ ? 1 : 0, version: ReactVersion, rendererPackageName: 'react-dom', diff --git a/packages/react-dom/src/client/ReactDOMClientInjection.js b/packages/react-dom/src/client/ReactDOMClientInjection.js index 2b77bcf70a73c..c2c6229e05656 100644 --- a/packages/react-dom/src/client/ReactDOMClientInjection.js +++ b/packages/react-dom/src/client/ReactDOMClientInjection.js @@ -5,8 +5,8 @@ * LICENSE file in the root directory of this source tree. */ -import * as EventPluginHub from 'events/EventPluginHub'; -import * as EventPluginUtils from 'events/EventPluginUtils'; +import {injection as EventPluginHubInjection} from 'events/EventPluginHub'; +import {setComponentTree} from 'events/EventPluginUtils'; import { getFiberCurrentPropsFromNode, @@ -23,8 +23,8 @@ import SimpleEventPlugin from '../events/SimpleEventPlugin'; /** * Inject modules for resolving DOM hierarchy and plugin ordering. */ -EventPluginHub.injection.injectEventPluginOrder(DOMEventPluginOrder); -EventPluginUtils.setComponentTree( +EventPluginHubInjection.injectEventPluginOrder(DOMEventPluginOrder); +setComponentTree( getFiberCurrentPropsFromNode, getInstanceFromNode, getNodeFromInstance, @@ -34,7 +34,7 @@ EventPluginUtils.setComponentTree( * Some important event plugins included by default (without having to require * them). */ -EventPluginHub.injection.injectEventPluginsByName({ +EventPluginHubInjection.injectEventPluginsByName({ SimpleEventPlugin: SimpleEventPlugin, EnterLeaveEventPlugin: EnterLeaveEventPlugin, ChangeEventPlugin: ChangeEventPlugin, diff --git a/packages/react-dom/src/client/ReactDOMComponent.js b/packages/react-dom/src/client/ReactDOMComponent.js index 27ac918a87336..50f21ccf47d57 100644 --- a/packages/react-dom/src/client/ReactDOMComponent.js +++ b/packages/react-dom/src/client/ReactDOMComponent.js @@ -14,12 +14,39 @@ import warning from 'shared/warning'; import {canUseDOM} from 'shared/ExecutionEnvironment'; import warningWithoutStack from 'shared/warningWithoutStack'; -import * as DOMPropertyOperations from './DOMPropertyOperations'; -import * as ReactDOMInput from './ReactDOMInput'; -import * as ReactDOMOption from './ReactDOMOption'; -import * as ReactDOMSelect from './ReactDOMSelect'; -import * as ReactDOMTextarea from './ReactDOMTextarea'; -import * as inputValueTracking from './inputValueTracking'; +import { + getValueForAttribute, + getValueForProperty, + setValueForProperty, +} from './DOMPropertyOperations'; +import { + initWrapperState as ReactDOMInputInitWrapperState, + getHostProps as ReactDOMInputGetHostProps, + postMountWrapper as ReactDOMInputPostMountWrapper, + updateChecked as ReactDOMInputUpdateChecked, + updateWrapper as ReactDOMInputUpdateWrapper, + restoreControlledState as ReactDOMInputRestoreControlledState, +} from './ReactDOMInput'; +import { + getHostProps as ReactDOMOptionGetHostProps, + postMountWrapper as ReactDOMOptionPostMountWrapper, + validateProps as ReactDOMOptionValidateProps, +} from './ReactDOMOption'; +import { + initWrapperState as ReactDOMSelectInitWrapperState, + getHostProps as ReactDOMSelectGetHostProps, + postMountWrapper as ReactDOMSelectPostMountWrapper, + restoreControlledState as ReactDOMSelectRestoreControlledState, + postUpdateWrapper as ReactDOMSelectPostUpdateWrapper, +} from './ReactDOMSelect'; +import { + initWrapperState as ReactDOMTextareaInitWrapperState, + getHostProps as ReactDOMTextareaGetHostProps, + postMountWrapper as ReactDOMTextareaPostMountWrapper, + updateWrapper as ReactDOMTextareaUpdateWrapper, + restoreControlledState as ReactDOMTextareaRestoreControlledState, +} from './ReactDOMTextarea'; +import {track} from './inputValueTracking'; import setInnerHTML from './setInnerHTML'; import setTextContent from './setTextContent'; import { @@ -32,7 +59,11 @@ import { } from '../events/DOMTopLevelEventTypes'; import {listenTo, trapBubbledEvent} from '../events/ReactBrowserEventEmitter'; import {mediaEventTypes} from '../events/DOMTopLevelEventTypes'; -import * as CSSPropertyOperations from '../shared/CSSPropertyOperations'; +import { + createDangerousStringForStyles, + setValueForStyles, + validateShorthandPropertyCollisionInDev, +} from '../shared/CSSPropertyOperations'; import {Namespaces, getIntrinsicNamespace} from '../shared/DOMNamespaces'; import { getPropertyInfo, @@ -276,7 +307,7 @@ function setInitialDOMProperties( } } // Relies on `updateStylesByID` not mutating `styleUpdates`. - CSSPropertyOperations.setValueForStyles(domElement, nextProp); + setValueForStyles(domElement, nextProp); } else if (propKey === DANGEROUSLY_SET_INNER_HTML) { const nextHtml = nextProp ? nextProp[HTML] : undefined; if (nextHtml != null) { @@ -313,12 +344,7 @@ function setInitialDOMProperties( ensureListeningTo(rootContainerElement, propKey); } } else if (nextProp != null) { - DOMPropertyOperations.setValueForProperty( - domElement, - propKey, - nextProp, - isCustomComponentTag, - ); + setValueForProperty(domElement, propKey, nextProp, isCustomComponentTag); } } } @@ -334,18 +360,13 @@ function updateDOMProperties( const propKey = updatePayload[i]; const propValue = updatePayload[i + 1]; if (propKey === STYLE) { - CSSPropertyOperations.setValueForStyles(domElement, propValue); + setValueForStyles(domElement, propValue); } else if (propKey === DANGEROUSLY_SET_INNER_HTML) { setInnerHTML(domElement, propValue); } else if (propKey === CHILDREN) { setTextContent(domElement, propValue); } else { - DOMPropertyOperations.setValueForProperty( - domElement, - propKey, - propValue, - isCustomComponentTag, - ); + setValueForProperty(domElement, propKey, propValue, isCustomComponentTag); } } } @@ -505,28 +526,28 @@ export function setInitialProperties( props = rawProps; break; case 'input': - ReactDOMInput.initWrapperState(domElement, rawProps); - props = ReactDOMInput.getHostProps(domElement, rawProps); + ReactDOMInputInitWrapperState(domElement, rawProps); + props = ReactDOMInputGetHostProps(domElement, rawProps); trapBubbledEvent(TOP_INVALID, domElement); // For controlled components we always need to ensure we're listening // to onChange. Even if there is no listener. ensureListeningTo(rootContainerElement, 'onChange'); break; case 'option': - ReactDOMOption.validateProps(domElement, rawProps); - props = ReactDOMOption.getHostProps(domElement, rawProps); + ReactDOMOptionValidateProps(domElement, rawProps); + props = ReactDOMOptionGetHostProps(domElement, rawProps); break; case 'select': - ReactDOMSelect.initWrapperState(domElement, rawProps); - props = ReactDOMSelect.getHostProps(domElement, rawProps); + ReactDOMSelectInitWrapperState(domElement, rawProps); + props = ReactDOMSelectGetHostProps(domElement, rawProps); trapBubbledEvent(TOP_INVALID, domElement); // For controlled components we always need to ensure we're listening // to onChange. Even if there is no listener. ensureListeningTo(rootContainerElement, 'onChange'); break; case 'textarea': - ReactDOMTextarea.initWrapperState(domElement, rawProps); - props = ReactDOMTextarea.getHostProps(domElement, rawProps); + ReactDOMTextareaInitWrapperState(domElement, rawProps); + props = ReactDOMTextareaGetHostProps(domElement, rawProps); trapBubbledEvent(TOP_INVALID, domElement); // For controlled components we always need to ensure we're listening // to onChange. Even if there is no listener. @@ -550,20 +571,20 @@ export function setInitialProperties( case 'input': // TODO: Make sure we check if this is still unmounted or do any clean // up necessary since we never stop tracking anymore. - inputValueTracking.track((domElement: any)); - ReactDOMInput.postMountWrapper(domElement, rawProps, false); + track((domElement: any)); + ReactDOMInputPostMountWrapper(domElement, rawProps, false); break; case 'textarea': // TODO: Make sure we check if this is still unmounted or do any clean // up necessary since we never stop tracking anymore. - inputValueTracking.track((domElement: any)); - ReactDOMTextarea.postMountWrapper(domElement, rawProps); + track((domElement: any)); + ReactDOMTextareaPostMountWrapper(domElement, rawProps); break; case 'option': - ReactDOMOption.postMountWrapper(domElement, rawProps); + ReactDOMOptionPostMountWrapper(domElement, rawProps); break; case 'select': - ReactDOMSelect.postMountWrapper(domElement, rawProps); + ReactDOMSelectPostMountWrapper(domElement, rawProps); break; default: if (typeof props.onClick === 'function') { @@ -592,23 +613,23 @@ export function diffProperties( let nextProps: Object; switch (tag) { case 'input': - lastProps = ReactDOMInput.getHostProps(domElement, lastRawProps); - nextProps = ReactDOMInput.getHostProps(domElement, nextRawProps); + lastProps = ReactDOMInputGetHostProps(domElement, lastRawProps); + nextProps = ReactDOMInputGetHostProps(domElement, nextRawProps); updatePayload = []; break; case 'option': - lastProps = ReactDOMOption.getHostProps(domElement, lastRawProps); - nextProps = ReactDOMOption.getHostProps(domElement, nextRawProps); + lastProps = ReactDOMOptionGetHostProps(domElement, lastRawProps); + nextProps = ReactDOMOptionGetHostProps(domElement, nextRawProps); updatePayload = []; break; case 'select': - lastProps = ReactDOMSelect.getHostProps(domElement, lastRawProps); - nextProps = ReactDOMSelect.getHostProps(domElement, nextRawProps); + lastProps = ReactDOMSelectGetHostProps(domElement, lastRawProps); + nextProps = ReactDOMSelectGetHostProps(domElement, nextRawProps); updatePayload = []; break; case 'textarea': - lastProps = ReactDOMTextarea.getHostProps(domElement, lastRawProps); - nextProps = ReactDOMTextarea.getHostProps(domElement, nextRawProps); + lastProps = ReactDOMTextareaGetHostProps(domElement, lastRawProps); + nextProps = ReactDOMTextareaGetHostProps(domElement, nextRawProps); updatePayload = []; break; default: @@ -767,10 +788,7 @@ export function diffProperties( } if (styleUpdates) { if (__DEV__) { - CSSPropertyOperations.validateShorthandPropertyCollisionInDev( - styleUpdates, - nextProps[STYLE], - ); + validateShorthandPropertyCollisionInDev(styleUpdates, nextProps[STYLE]); } (updatePayload = updatePayload || []).push(STYLE, styleUpdates); } @@ -793,7 +811,7 @@ export function updateProperties( nextRawProps.type === 'radio' && nextRawProps.name != null ) { - ReactDOMInput.updateChecked(domElement, nextRawProps); + ReactDOMInputUpdateChecked(domElement, nextRawProps); } const wasCustomComponentTag = isCustomComponent(tag, lastRawProps); @@ -813,15 +831,15 @@ export function updateProperties( // Update the wrapper around inputs *after* updating props. This has to // happen after `updateDOMProperties`. Otherwise HTML5 input validations // raise warnings and prevent the new value from being assigned. - ReactDOMInput.updateWrapper(domElement, nextRawProps); + ReactDOMInputUpdateWrapper(domElement, nextRawProps); break; case 'textarea': - ReactDOMTextarea.updateWrapper(domElement, nextRawProps); + ReactDOMTextareaUpdateWrapper(domElement, nextRawProps); break; case 'select': //