Rename experimental react-ui => react-interactions (#16842)

packages/react-interactions/README.md

@@ -1,4 +1,4 @@
-# `react-ui`
+# `react-interactions`
 
 This package is experimental. It is intended for use with the experimental React
 flags for internal testing.

packages/react-interactions/accessibility/src/FocusTable.js

@@ -8,11 +8,11 @@
  */
 
 import type {ReactScopeMethods} from 'shared/ReactTypes';
-import type {KeyboardEvent} from 'react-ui/events/keyboard';
+import type {KeyboardEvent} from 'react-interactions/events/keyboard';
 
 import React from 'react';
-import {tabFocusableImpl} from 'react-ui/accessibility/tabbable-scope';
-import {useKeyboard} from 'react-ui/events/keyboard';
+import {tabFocusableImpl} from 'react-interactions/accessibility/tabbable-scope';
+import {useKeyboard} from 'react-interactions/events/keyboard';
 
 type FocusCellProps = {
   children?: React.Node,

packages/react-interactions/accessibility/src/TabFocus.js

@@ -8,11 +8,11 @@
  */
 
 import type {ReactScopeMethods} from 'shared/ReactTypes';
-import type {KeyboardEvent} from 'react-ui/events/keyboard';
+import type {KeyboardEvent} from 'react-interactions/events/keyboard';
 
 import React from 'react';
-import {TabbableScope} from 'react-ui/accessibility/tabbable-scope';
-import {useKeyboard} from 'react-ui/events/keyboard';
+import {TabbableScope} from 'react-interactions/accessibility/tabbable-scope';
+import {useKeyboard} from 'react-interactions/events/keyboard';
 
 type TabFocusControllerProps = {
   children: React.Node,

packages/react-interactions/accessibility/src/__tests__/FocusTable-test.internal.js

@@ -7,7 +7,7 @@
  * @flow
  */
 
-import {createEventTarget} from 'react-ui/events/src/dom/testing-library';
+import {createEventTarget} from 'react-interactions/events/src/dom/testing-library';
 
 let React;
 let ReactFeatureFlags;

packages/react-interactions/accessibility/src/__tests__/TabFocus-test.internal.js

@@ -7,7 +7,7 @@
  * @flow
  */
 
-import {createEventTarget} from 'react-ui/events/src/dom/testing-library';
+import {createEventTarget} from 'react-interactions/events/src/dom/testing-library';
 
 let React;
 let ReactFeatureFlags;

packages/react-interactions/events/src/dom/Press.js

@@ -10,8 +10,8 @@
 import type {PointerType} from 'shared/ReactDOMTypes';
 
 import React from 'react';
-import {useTap} from 'react-ui/events/tap';
-import {useKeyboard} from 'react-ui/events/keyboard';
+import {useTap} from 'react-interactions/events/tap';
+import {useKeyboard} from 'react-interactions/events/keyboard';
 
 const emptyObject = {};
 

packages/react-interactions/events/src/dom/__tests__/ContextMenu-test.internal.js

@@ -28,7 +28,8 @@ function initializeModules(hasPointerEvents) {
   ReactFeatureFlags.enableFlareAPI = true;
   React = require('react');
   ReactDOM = require('react-dom');
-  useContextMenu = require('react-ui/events/context-menu').useContextMenu;
+  useContextMenu = require('react-interactions/events/context-menu')
+    .useContextMenu;
 }
 
 const forcePointerEvents = true;

packages/react-interactions/events/src/dom/__tests__/Drag-test.internal.js

@@ -23,7 +23,7 @@ describe('Drag event responder', () => {
     ReactFeatureFlags.enableFlareAPI = true;
     React = require('react');
     ReactDOM = require('react-dom');
-    useDrag = require('react-ui/events/drag').useDrag;
+    useDrag = require('react-interactions/events/drag').useDrag;
 
     container = document.createElement('div');
     document.body.appendChild(container);

packages/react-interactions/events/src/dom/__tests__/Focus-test.internal.js

@@ -24,8 +24,8 @@ function initializeModules(hasPointerEvents) {
   ReactFeatureFlags.enableFlareAPI = true;
   React = require('react');
   ReactDOM = require('react-dom');
-  FocusResponder = require('react-ui/events/focus').FocusResponder;
-  useFocus = require('react-ui/events/focus').useFocus;
+  FocusResponder = require('react-interactions/events/focus').FocusResponder;
+  useFocus = require('react-interactions/events/focus').useFocus;
 }
 
 const forcePointerEvents = true;

packages/react-interactions/events/src/dom/__tests__/FocusWithin-test.internal.js

@@ -24,8 +24,9 @@ const initializeModules = hasPointerEvents => {
   ReactFeatureFlags.enableFlareAPI = true;
   React = require('react');
   ReactDOM = require('react-dom');
-  FocusWithinResponder = require('react-ui/events/focus').FocusWithinResponder;
-  useFocusWithin = require('react-ui/events/focus').useFocusWithin;
+  FocusWithinResponder = require('react-interactions/events/focus')
+    .FocusWithinResponder;
+  useFocusWithin = require('react-interactions/events/focus').useFocusWithin;
 };
 
 const forcePointerEvents = true;

packages/react-interactions/events/src/dom/__tests__/Hover-test.internal.js

@@ -25,8 +25,8 @@ function initializeModules(hasPointerEvents) {
   ReactFeatureFlags.enableUserBlockingEvents = true;
   React = require('react');
   ReactDOM = require('react-dom');
-  HoverResponder = require('react-ui/events/hover').HoverResponder;
-  useHover = require('react-ui/events/hover').useHover;
+  HoverResponder = require('react-interactions/events/hover').HoverResponder;
+  useHover = require('react-interactions/events/hover').useHover;
 }
 
 const forcePointerEvents = true;

packages/react-interactions/events/src/dom/__tests__/Input-test.internal.js

@@ -39,8 +39,8 @@ const modulesInit = () => {
   React = require('react');
   ReactDOM = require('react-dom');
   Scheduler = require('scheduler');
-  InputResponder = require('react-ui/events/input').InputResponder;
-  useInput = require('react-ui/events/input').useInput;
+  InputResponder = require('react-interactions/events/input').InputResponder;
+  useInput = require('react-interactions/events/input').useInput;
 };
 
 describe('Input event responder', () => {

packages/react-interactions/events/src/dom/__tests__/Keyboard-test.internal.js

@@ -22,7 +22,7 @@ function initializeModules(hasPointerEvents) {
   ReactFeatureFlags.enableFlareAPI = true;
   React = require('react');
   ReactDOM = require('react-dom');
-  useKeyboard = require('react-ui/events/keyboard').useKeyboard;
+  useKeyboard = require('react-interactions/events/keyboard').useKeyboard;
 }
 
 describe('Keyboard responder', () => {

packages/react-interactions/events/src/dom/__tests__/MixedResponders-test-internal.js

@@ -35,7 +35,7 @@ describe('mixing responders with the heritage event system', () => {
   });
 
   it('should properly only flush sync once when the event systems are mixed', () => {
-    const useTap = require('react-ui/events/tap').useTap;
+    const useTap = require('react-interactions/events/tap').useTap;
     const ref = React.createRef();
     let renderCounts = 0;
 
@@ -104,7 +104,7 @@ describe('mixing responders with the heritage event system', () => {
   });
 
   it('should properly flush sync when the event systems are mixed with unstable_flushDiscreteUpdates', () => {
-    const useTap = require('react-ui/events/tap').useTap;
+    const useTap = require('react-interactions/events/tap').useTap;
     const ref = React.createRef();
     let renderCounts = 0;
 
@@ -177,7 +177,7 @@ describe('mixing responders with the heritage event system', () => {
       'event systems',
     async () => {
       const {useState} = React;
-      const useTap = require('react-ui/events/tap').useTap;
+      const useTap = require('react-interactions/events/tap').useTap;
 
       const button = React.createRef();
 
@@ -237,8 +237,8 @@ describe('mixing responders with the heritage event system', () => {
     it('is async for non-input events', () => {
       ReactFeatureFlags.debugRenderPhaseSideEffectsForStrictMode = false;
       ReactFeatureFlags.enableUserBlockingEvents = true;
-      const useTap = require('react-ui/events/tap').useTap;
-      const useInput = require('react-ui/events/input').useInput;
+      const useTap = require('react-interactions/events/tap').useTap;
+      const useInput = require('react-interactions/events/input').useInput;
       const root = ReactDOM.unstable_createRoot(container);
       let input;
 

packages/react-interactions/events/src/dom/__tests__/Press-test.internal.js

@@ -28,7 +28,7 @@ function initializeModules(hasPointerEvents) {
   ReactFeatureFlags.enableFlareAPI = true;
   React = require('react');
   ReactDOM = require('react-dom');
-  usePress = require('react-ui/events/press').usePress;
+  usePress = require('react-interactions/events/press').usePress;
 }
 
 const pointerTypesTable = [['mouse'], ['touch']];

packages/react-interactions/events/src/dom/__tests__/PressLegacy-test.internal.js

@@ -28,8 +28,9 @@ function initializeModules(hasPointerEvents) {
   ReactFeatureFlags.enableFlareAPI = true;
   React = require('react');
   ReactDOM = require('react-dom');
-  PressResponder = require('react-ui/events/press-legacy').PressResponder;
-  usePress = require('react-ui/events/press-legacy').usePress;
+  PressResponder = require('react-interactions/events/press-legacy')
+    .PressResponder;
+  usePress = require('react-interactions/events/press-legacy').usePress;
 }
 
 function removePressMoveStrings(eventString) {

packages/react-interactions/events/src/dom/__tests__/Scroll-test.internal.js

@@ -26,7 +26,7 @@ const initializeModules = hasPointerEvents => {
   ReactFeatureFlags.enableFlareAPI = true;
   React = require('react');
   ReactDOM = require('react-dom');
-  useScroll = require('react-ui/events/scroll').useScroll;
+  useScroll = require('react-interactions/events/scroll').useScroll;
 };
 
 describe.each(table)('Scroll responder', hasPointerEvents => {

packages/react-interactions/events/src/dom/__tests__/Tap-test.internal.js

@@ -29,7 +29,7 @@ function initializeModules(hasPointerEvents) {
   ReactFeatureFlags.enableFlareAPI = true;
   React = require('react');
   ReactDOM = require('react-dom');
-  useTap = require('react-ui/events/tap').useTap;
+  useTap = require('react-interactions/events/tap').useTap;
 }
 
 const coordinatesInside = {x: 51, y: 51};

packages/react-interactions/npm/drag.js

@@ -0,0 +1,7 @@
+'use strict';
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./cjs/react-interactions-events/drag.production.min.js');
+} else {
+  module.exports = require('./cjs/react-interactions-events/drag.development.js');
+}

packages/react-interactions/npm/focus.js

@@ -0,0 +1,7 @@
+'use strict';
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./cjs/react-interactions-events/focus.production.min.js');
+} else {
+  module.exports = require('./cjs/react-interactions-events/focus.development.js');
+}

packages/react-interactions/npm/hover.js

@@ -0,0 +1,7 @@
+'use strict';
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./cjs/react-interactions-events/hover.production.min.js');
+} else {
+  module.exports = require('./cjs/react-interactions-events/hover.development.js');
+}

packages/react-interactions/npm/input.js

@@ -0,0 +1,7 @@
+'use strict';
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./cjs/react-interactions-events/input.production.min.js');
+} else {
+  module.exports = require('./cjs/react-interactions-events/input.development.js');
+}

packages/react-interactions/npm/keyboard.js

@@ -0,0 +1,7 @@
+'use strict';
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./cjs/react-interactions-events/keyboard.production.min.js');
+} else {
+  module.exports = require('./cjs/react-interactions-events/keyboard.development.js');
+}

packages/react-interactions/npm/press-legacy.js

@@ -0,0 +1,7 @@
+'use strict';
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./cjs/react-interactions-events/press-legacy.production.min.js');
+} else {
+  module.exports = require('./cjs/react-interactions-events/press-legacy.development.js');
+}

packages/react-interactions/npm/press.js

@@ -0,0 +1,7 @@
+'use strict';
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./cjs/react-interactions-events/press.production.min.js');
+} else {
+  module.exports = require('./cjs/react-interactions-events/press.development.js');
+}

packages/react-interactions/npm/scroll.js

@@ -0,0 +1,7 @@
+'use strict';
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./cjs/react-interactions-events/scroll.production.min.js');
+} else {
+  module.exports = require('./cjs/react-interactions-events/scroll.development.js');
+}

packages/react-interactions/npm/swipe.js

@@ -0,0 +1,7 @@
+'use strict';
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./cjs/react-interactions-events/swipe.production.min.js');
+} else {
+  module.exports = require('./cjs/react-interactions-events/swipe.development.js');
+}

packages/react-interactions/npm/tap.js

@@ -0,0 +1,7 @@
+'use strict';
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./cjs/react-interactions-events/tap.production.min.js');
+} else {
+  module.exports = require('./cjs/react-interactions-events/tap.development.js');
+}

packages/react-interactions/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "react-ui",
+  "name": "react-interactions",
   "private": true,
   "description": "React is a JavaScript library for building user interfaces.",
   "keywords": [

packages/react-reconciler/src/__tests__/ReactScope-test.internal.js

@@ -9,7 +9,7 @@
 
 'use strict';
 
-import {createEventTarget} from 'react-ui/events/src/dom/testing-library';
+import {createEventTarget} from 'react-interactions/events/src/dom/testing-library';
 
 let React;
 let ReactFeatureFlags;
@@ -204,7 +204,8 @@ describe('ReactScope', () => {
       let onKeyDown = jest.fn();
       const TestScope = React.unstable_createScope((type, props) => true);
       const ref = React.createRef();
-      const useKeyboard = require('react-ui/events/keyboard').useKeyboard;
+      const useKeyboard = require('react-interactions/events/keyboard')
+        .useKeyboard;
       let Component = () => {
         const listener = useKeyboard({
           onKeyDown,

packages/react-ui/npm/drag.js

@@ -1,7 +0,0 @@
-'use strict';
-
-if (process.env.NODE_ENV === 'production') {
-  module.exports = require('./cjs/react-ui-events/drag.production.min.js');
-} else {
-  module.exports = require('./cjs/react-ui-events/drag.development.js');
-}

packages/react-ui/npm/focus.js

@@ -1,7 +0,0 @@
-'use strict';
-
-if (process.env.NODE_ENV === 'production') {
-  module.exports = require('./cjs/react-ui-events/focus.production.min.js');
-} else {
-  module.exports = require('./cjs/react-ui-events/focus.development.js');
-}

packages/react-ui/npm/hover.js

@@ -1,7 +0,0 @@
-'use strict';
-
-if (process.env.NODE_ENV === 'production') {
-  module.exports = require('./cjs/react-ui-events/hover.production.min.js');
-} else {
-  module.exports = require('./cjs/react-ui-events/hover.development.js');
-}

packages/react-ui/npm/input.js

@@ -1,7 +0,0 @@
-'use strict';
-
-if (process.env.NODE_ENV === 'production') {
-  module.exports = require('./cjs/react-ui-events/input.production.min.js');
-} else {
-  module.exports = require('./cjs/react-ui-events/input.development.js');
-}

packages/react-ui/npm/keyboard.js

@@ -1,7 +0,0 @@
-'use strict';
-
-if (process.env.NODE_ENV === 'production') {
-  module.exports = require('./cjs/react-ui-events/keyboard.production.min.js');
-} else {
-  module.exports = require('./cjs/react-ui-events/keyboard.development.js');
-}

packages/react-ui/npm/press-legacy.js

@@ -1,7 +0,0 @@
-'use strict';
-
-if (process.env.NODE_ENV === 'production') {
-  module.exports = require('./cjs/react-ui-events/press-legacy.production.min.js');
-} else {
-  module.exports = require('./cjs/react-ui-events/press-legacy.development.js');
-}

packages/react-ui/npm/press.js

@@ -1,7 +0,0 @@
-'use strict';
-
-if (process.env.NODE_ENV === 'production') {
-  module.exports = require('./cjs/react-ui-events/press.production.min.js');
-} else {
-  module.exports = require('./cjs/react-ui-events/press.development.js');
-}

packages/react-ui/npm/scroll.js

@@ -1,7 +0,0 @@
-'use strict';
-
-if (process.env.NODE_ENV === 'production') {
-  module.exports = require('./cjs/react-ui-events/scroll.production.min.js');
-} else {
-  module.exports = require('./cjs/react-ui-events/scroll.development.js');
-}

packages/react-ui/npm/swipe.js

@@ -1,7 +0,0 @@
-'use strict';
-
-if (process.env.NODE_ENV === 'production') {
-  module.exports = require('./cjs/react-ui-events/swipe.production.min.js');
-} else {
-  module.exports = require('./cjs/react-ui-events/swipe.development.js');
-}

packages/react-ui/npm/tap.js

@@ -1,7 +0,0 @@
-'use strict';
-
-if (process.env.NODE_ENV === 'production') {
-  module.exports = require('./cjs/react-ui-events/tap.production.min.js');
-} else {
-  module.exports = require('./cjs/react-ui-events/tap.development.js');
-}

scripts/rollup/bundles.js

@@ -505,7 +505,7 @@ const bundles = [
       FB_WWW_PROD,
     ],
     moduleType: NON_FIBER_RENDERER,
-    entry: 'react-ui/events/context-menu',
+    entry: 'react-interactions/events/context-menu',
     global: 'ReactEventsContextMenu',
     externals: ['react'],
   },
@@ -520,7 +520,7 @@ const bundles = [
       FB_WWW_PROD,
     ],
     moduleType: NON_FIBER_RENDERER,
-    entry: 'react-ui/events/drag',
+    entry: 'react-interactions/events/drag',
     global: 'ReactEventsDrag',
     externals: ['react'],
   },
@@ -535,7 +535,7 @@ const bundles = [
       FB_WWW_PROD,
     ],
     moduleType: NON_FIBER_RENDERER,
-    entry: 'react-ui/events/focus',
+    entry: 'react-interactions/events/focus',
     global: 'ReactEventsFocus',
     externals: ['react'],
   },
@@ -550,7 +550,7 @@ const bundles = [
       FB_WWW_PROD,
     ],
     moduleType: NON_FIBER_RENDERER,
-    entry: 'react-ui/events/hover',
+    entry: 'react-interactions/events/hover',
     global: 'ReactEventsHover',
     externals: ['react'],
   },
@@ -565,7 +565,7 @@ const bundles = [
       FB_WWW_PROD,
     ],
     moduleType: NON_FIBER_RENDERER,
-    entry: 'react-ui/events/input',
+    entry: 'react-interactions/events/input',
     global: 'ReactEventsInput',
     externals: ['react'],
   },
@@ -580,7 +580,7 @@ const bundles = [
       FB_WWW_PROD,
     ],
     moduleType: NON_FIBER_RENDERER,
-    entry: 'react-ui/events/keyboard',
+    entry: 'react-interactions/events/keyboard',
     global: 'ReactEventsKeyboard',
     externals: ['react'],
   },
@@ -595,9 +595,13 @@ const bundles = [
       FB_WWW_PROD,
     ],
     moduleType: NON_FIBER_RENDERER,
-    entry: 'react-ui/events/press',
+    entry: 'react-interactions/events/press',
     global: 'ReactEventsPress',
-    externals: ['react', 'react-ui/events/tap', 'react-ui/events/keyboard'],
+    externals: [
+      'react',
+      'react-interactions/events/tap',
+      'react-interactions/events/keyboard',
+    ],
   },
 
   {
@@ -610,7 +614,7 @@ const bundles = [
       FB_WWW_PROD,
     ],
     moduleType: NON_FIBER_RENDERER,
-    entry: 'react-ui/events/press-legacy',
+    entry: 'react-interactions/events/press-legacy',
     global: 'ReactEventsPressLegacy',
     externals: ['react'],
   },
@@ -625,7 +629,7 @@ const bundles = [
       FB_WWW_PROD,
     ],
     moduleType: NON_FIBER_RENDERER,
-    entry: 'react-ui/events/scroll',
+    entry: 'react-interactions/events/scroll',
     global: 'ReactEventsScroll',
     externals: ['react'],
   },
@@ -640,7 +644,7 @@ const bundles = [
       FB_WWW_PROD,
     ],
     moduleType: NON_FIBER_RENDERER,
-    entry: 'react-ui/events/swipe',
+    entry: 'react-interactions/events/swipe',
     global: 'ReactEventsSwipe',
     externals: ['react'],
   },
@@ -655,7 +659,7 @@ const bundles = [
       FB_WWW_PROD,
     ],
     moduleType: NON_FIBER_RENDERER,
-    entry: 'react-ui/events/tap',
+    entry: 'react-interactions/events/tap',
     global: 'ReactEventsTap',
     externals: ['react'],
   },
@@ -665,40 +669,40 @@ const bundles = [
   {
     bundleTypes: [NODE_DEV, NODE_PROD, FB_WWW_DEV, FB_WWW_PROD],
     moduleType: NON_FIBER_RENDERER,
-    entry: 'react-ui/accessibility/focus-table',
+    entry: 'react-interactions/accessibility/focus-table',
     global: 'ReactFocusTable',
     externals: [
       'react',
-      'react-ui/events/keyboard',
-      'react-ui/accessibility/tabbable-scope',
+      'react-interactions/events/keyboard',
+      'react-interactions/accessibility/tabbable-scope',
     ],
   },
 
   {
     bundleTypes: [NODE_DEV, NODE_PROD, FB_WWW_DEV, FB_WWW_PROD],
     moduleType: NON_FIBER_RENDERER,
-    entry: 'react-ui/accessibility/tab-focus',
+    entry: 'react-interactions/accessibility/tab-focus',
     global: 'ReactTabFocus',
     externals: [
       'react',
-      'react-ui/events/keyboard',
-      'react-ui/accessibility/tabbable-scope',
+      'react-interactions/events/keyboard',
+      'react-interactions/accessibility/tabbable-scope',
     ],
   },
 
   {
     bundleTypes: [NODE_DEV, NODE_PROD, FB_WWW_DEV, FB_WWW_PROD],
     moduleType: NON_FIBER_RENDERER,
-    entry: 'react-ui/accessibility/tabbable-scope',
+    entry: 'react-interactions/accessibility/tabbable-scope',
     global: 'ReactTabbableScope',
     externals: ['react'],
   },
 ];
 
 const fbBundleExternalsMap = {
-  'react-ui/events/keyboard': 'ReactEventsKeyboard',
-  'react-ui/events/tap': 'ReactEventsTap',
-  'react-ui/accessibility/tabbable-scope': 'ReactTabbableScope',
+  'react-interactions/events/keyboard': 'ReactEventsKeyboard',
+  'react-interactions/events/tap': 'ReactEventsTap',
+  'react-interactions/accessibility/tabbable-scope': 'ReactTabbableScope',
 };
 
 // Based on deep-freeze by substack (public domain)

scripts/rollup/modules.js

@@ -23,8 +23,8 @@ const importSideEffects = Object.freeze({
 const knownGlobals = Object.freeze({
   react: 'React',
   'react-dom': 'ReactDOM',
-  'react-ui/events/keyboard': 'ReactEventsKeyboard',
-  'react-ui/events/tap': 'ReactEventsTap',
+  'react-interactions/events/keyboard': 'ReactEventsKeyboard',
+  'react-interactions/events/tap': 'ReactEventsTap',
   scheduler: 'Scheduler',
   'scheduler/tracing': 'SchedulerTracing',
   'scheduler/unstable_mock': 'SchedulerMock',

scripts/shared/pathsByLanguageVersion.js

@@ -12,8 +12,8 @@ const esNextPaths = [
   'packages/*/*.js',
   // Source files
   'packages/*/src/**/*.js',
-  'packages/react-ui/**/*.js',
-  'packages/react-ui/**/*.js',
+  'packages/react-interactions/**/*.js',
+  'packages/react-interactions/**/*.js',
   'packages/legacy-events/**/*.js',
   'packages/shared/**/*.js',
   // Shims and Flow environment