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

packages/react-ui/README.md → 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-ui/accessibility/src/FocusTable.js → 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-ui/accessibility/src/TabFocus.js → 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-ui/accessibility/src/__tests__/FocusTable-test.internal.js → 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-ui/accessibility/src/__tests__/TabFocus-test.internal.js → 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-ui/events/src/dom/Press.js → 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-ui/events/src/dom/__tests__/ContextMenu-test.internal.js → 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-ui/events/src/dom/__tests__/Drag-test.internal.js → 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-ui/events/src/dom/__tests__/Focus-test.internal.js → 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-ui/events/src/dom/__tests__/FocusWithin-test.internal.js → 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-ui/events/src/dom/__tests__/Hover-test.internal.js → 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-ui/events/src/dom/__tests__/Input-test.internal.js → 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-ui/events/src/dom/__tests__/Keyboard-test.internal.js → 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-ui/events/src/dom/__tests__/MixedResponders-test-internal.js → 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-ui/events/src/dom/__tests__/Press-test.internal.js → 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-ui/events/src/dom/__tests__/PressLegacy-test.internal.js → 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-ui/events/src/dom/__tests__/Scroll-test.internal.js → 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-ui/events/src/dom/__tests__/Tap-test.internal.js → 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-ui/package.json → 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,