Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[react-ui] Move experimental event+a11y work to react-ui package #16794

Merged
merged 3 commits into from
Sep 16, 2019
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@

'use strict';

import {createEventTarget} from 'react-events/src/dom/testing-library';
import {createEventTarget} from 'react-ui/events/src/dom/testing-library';

let React;
let ReactFeatureFlags;
Expand Down Expand Up @@ -204,7 +204,7 @@ describe('ReactScope', () => {
let onKeyDown = jest.fn();
const TestScope = React.unstable_createScope((type, props) => true);
const ref = React.createRef();
const useKeyboard = require('react-events/keyboard').useKeyboard;
const useKeyboard = require('react-ui/events/keyboard').useKeyboard;
let Component = () => {
const listener = useKeyboard({
onKeyDown,
Expand Down
4 changes: 4 additions & 0 deletions packages/react-ui/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
# `react-ui`

This package is experimental. It is intended for use with the experimental React
flags for internal testing.
Original file line number Diff line number Diff line change
Expand Up @@ -7,11 +7,11 @@
* @flow
*/

import type {KeyboardEvent} from 'react-events/src/dom/Keyboard';
import type {KeyboardEvent} from 'react-ui/events/src/dom/Keyboard';

import React from 'react';
import {tabFocusableImpl} from './TabbableScope';
import {useKeyboard} from 'react-events/keyboard';
import {useKeyboard} from '../../events/keyboard';
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oops this is the non-type import that could get inlined

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is okay. I plan on doing a follow up where I add the a11y components to build and will revise it there.


type GridComponentProps = {
children: React.Node,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,11 +8,11 @@
*/

import type {ReactScopeMethods} from 'shared/ReactTypes';
import type {KeyboardEvent} from 'react-events/src/dom/Keyboard';
import type {KeyboardEvent} from 'react-ui/events/src/dom/Keyboard';

import React from 'react';
import {TabbableScope} from './TabbableScope';
import {useKeyboard} from 'react-events/keyboard';
import {useKeyboard} from '../../events/keyboard';
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Here too

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is okay. I plan on doing a follow up where I add the a11y components to build and will revise it there.


type TabFocusControllerProps = {
children: React.Node,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
* @flow
*/

import {createEventTarget} from 'react-events/src/dom/testing-library';
import {createEventTarget} from 'react-ui/events/src/dom/testing-library';

let React;
let ReactFeatureFlags;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
* @flow
*/

import {createEventTarget} from 'react-events/src/dom/testing-library';
import {createEventTarget} from 'react-ui/events/src/dom/testing-library';

let React;
let ReactFeatureFlags;
Expand Down
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
# `react-events`
# `react-ui/events`

*This package is experimental. It is intended for use with the experimental React
events API that is not available in open source builds.*
Expand Down
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ function initializeModules(hasPointerEvents) {
ReactFeatureFlags.enableFlareAPI = true;
React = require('react');
ReactDOM = require('react-dom');
useContextMenu = require('react-events/context-menu').useContextMenu;
useContextMenu = require('react-ui/events/context-menu').useContextMenu;
}

const forcePointerEvents = true;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ describe('Drag event responder', () => {
ReactFeatureFlags.enableFlareAPI = true;
React = require('react');
ReactDOM = require('react-dom');
useDrag = require('react-events/drag').useDrag;
useDrag = require('react-ui/events/drag').useDrag;

container = document.createElement('div');
document.body.appendChild(container);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -24,8 +24,8 @@ function initializeModules(hasPointerEvents) {
ReactFeatureFlags.enableFlareAPI = true;
React = require('react');
ReactDOM = require('react-dom');
FocusResponder = require('react-events/focus').FocusResponder;
useFocus = require('react-events/focus').useFocus;
FocusResponder = require('react-ui/events/focus').FocusResponder;
useFocus = require('react-ui/events/focus').useFocus;
}

const forcePointerEvents = true;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -24,8 +24,8 @@ const initializeModules = hasPointerEvents => {
ReactFeatureFlags.enableFlareAPI = true;
React = require('react');
ReactDOM = require('react-dom');
FocusWithinResponder = require('react-events/focus').FocusWithinResponder;
useFocusWithin = require('react-events/focus').useFocusWithin;
FocusWithinResponder = require('react-ui/events/focus').FocusWithinResponder;
useFocusWithin = require('react-ui/events/focus').useFocusWithin;
};

const forcePointerEvents = true;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -25,8 +25,8 @@ function initializeModules(hasPointerEvents) {
ReactFeatureFlags.enableUserBlockingEvents = true;
React = require('react');
ReactDOM = require('react-dom');
HoverResponder = require('react-events/hover').HoverResponder;
useHover = require('react-events/hover').useHover;
HoverResponder = require('react-ui/events/hover').HoverResponder;
useHover = require('react-ui/events/hover').useHover;
}

const forcePointerEvents = true;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -39,8 +39,8 @@ const modulesInit = () => {
React = require('react');
ReactDOM = require('react-dom');
Scheduler = require('scheduler');
InputResponder = require('react-events/input').InputResponder;
useInput = require('react-events/input').useInput;
InputResponder = require('react-ui/events/input').InputResponder;
useInput = require('react-ui/events/input').useInput;
};

describe('Input event responder', () => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ function initializeModules(hasPointerEvents) {
ReactFeatureFlags.enableFlareAPI = true;
React = require('react');
ReactDOM = require('react-dom');
useKeyboard = require('react-events/keyboard').useKeyboard;
useKeyboard = require('react-ui/events/keyboard').useKeyboard;
}

describe('Keyboard responder', () => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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 usePress = require('react-events/press').usePress;
const usePress = require('react-ui/events/press').usePress;
const ref = React.createRef();
let renderCounts = 0;

Expand Down Expand Up @@ -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 usePress = require('react-events/press').usePress;
const usePress = require('react-ui/events/press').usePress;
const ref = React.createRef();
let renderCounts = 0;

Expand Down Expand Up @@ -177,7 +177,7 @@ describe('mixing responders with the heritage event system', () => {
'event systems',
async () => {
const {useState} = React;
const usePress = require('react-events/press').usePress;
const usePress = require('react-ui/events/press').usePress;

const button = React.createRef();

Expand Down Expand Up @@ -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 usePress = require('react-events/press').usePress;
const useInput = require('react-events/input').useInput;
const usePress = require('react-ui/events/press').usePress;
const useInput = require('react-ui/events/input').useInput;
const root = ReactDOM.unstable_createRoot(container);
let input;

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -28,8 +28,8 @@ function initializeModules(hasPointerEvents) {
ReactFeatureFlags.enableFlareAPI = true;
React = require('react');
ReactDOM = require('react-dom');
PressResponder = require('react-events/press').PressResponder;
usePress = require('react-events/press').usePress;
PressResponder = require('react-ui/events/press').PressResponder;
usePress = require('react-ui/events/press').usePress;
}

function removePressMoveStrings(eventString) {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ const initializeModules = hasPointerEvents => {
ReactFeatureFlags.enableFlareAPI = true;
React = require('react');
ReactDOM = require('react-dom');
useScroll = require('react-events/scroll').useScroll;
useScroll = require('react-ui/events/scroll').useScroll;
};

describe.each(table)('Scroll responder', hasPointerEvents => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ function initializeModules(hasPointerEvents) {
ReactFeatureFlags.enableFlareAPI = true;
React = require('react');
ReactDOM = require('react-dom');
useTap = require('react-events/tap').useTap;
useTap = require('react-ui/events/tap').useTap;
}

const coordinatesInside = {x: 51, y: 51};
Expand Down
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{
"name": "react-events",
"name": "react-ui",
"private": true,
"description": "React is a JavaScript library for building user interfaces.",
"keywords": [
Expand All @@ -12,16 +12,17 @@
"files": [
"LICENSE",
"README.md",
"context-menu.js",
"drag.js",
"focus.js",
"hover.js",
"input.js",
"keyboard.js",
"press.js",
"scroll.js",
"swipe.js",
"tap.js",
"events/README.md",
"events/context-menu.js",
"events/drag.js",
"events/focus.js",
"events/hover.js",
"events/input.js",
"events/keyboard.js",
"events/press.js",
"events/scroll.js",
"events/swipe.js",
"events/tap.js",
"build-info.json",
"cjs/",
"umd/"
Expand Down
20 changes: 10 additions & 10 deletions scripts/rollup/bundles.js
Original file line number Diff line number Diff line change
Expand Up @@ -505,7 +505,7 @@ const bundles = [
FB_WWW_PROD,
],
moduleType: NON_FIBER_RENDERER,
entry: 'react-events/context-menu',
entry: 'react-ui/events/context-menu',
global: 'ReactEventsContextMenu',
externals: ['react'],
},
Expand All @@ -520,7 +520,7 @@ const bundles = [
FB_WWW_PROD,
],
moduleType: NON_FIBER_RENDERER,
entry: 'react-events/drag',
entry: 'react-ui/events/drag',
global: 'ReactEventsDrag',
externals: ['react'],
},
Expand All @@ -535,7 +535,7 @@ const bundles = [
FB_WWW_PROD,
],
moduleType: NON_FIBER_RENDERER,
entry: 'react-events/focus',
entry: 'react-ui/events/focus',
global: 'ReactEventsFocus',
externals: ['react'],
},
Expand All @@ -550,7 +550,7 @@ const bundles = [
FB_WWW_PROD,
],
moduleType: NON_FIBER_RENDERER,
entry: 'react-events/hover',
entry: 'react-ui/events/hover',
global: 'ReactEventsHover',
externals: ['react'],
},
Expand All @@ -565,7 +565,7 @@ const bundles = [
FB_WWW_PROD,
],
moduleType: NON_FIBER_RENDERER,
entry: 'react-events/input',
entry: 'react-ui/events/input',
global: 'ReactEventsInput',
externals: ['react'],
},
Expand All @@ -580,7 +580,7 @@ const bundles = [
FB_WWW_PROD,
],
moduleType: NON_FIBER_RENDERER,
entry: 'react-events/keyboard',
entry: 'react-ui/events/keyboard',
global: 'ReactEventsKeyboard',
externals: ['react'],
},
Expand All @@ -595,7 +595,7 @@ const bundles = [
FB_WWW_PROD,
],
moduleType: NON_FIBER_RENDERER,
entry: 'react-events/press',
entry: 'react-ui/events/press',
global: 'ReactEventsPress',
externals: ['react'],
},
Expand All @@ -610,7 +610,7 @@ const bundles = [
FB_WWW_PROD,
],
moduleType: NON_FIBER_RENDERER,
entry: 'react-events/scroll',
entry: 'react-ui/events/scroll',
global: 'ReactEventsScroll',
externals: ['react'],
},
Expand All @@ -625,7 +625,7 @@ const bundles = [
FB_WWW_PROD,
],
moduleType: NON_FIBER_RENDERER,
entry: 'react-events/swipe',
entry: 'react-ui/events/swipe',
global: 'ReactEventsSwipe',
externals: ['react'],
},
Expand All @@ -640,7 +640,7 @@ const bundles = [
FB_WWW_PROD,
],
moduleType: NON_FIBER_RENDERER,
entry: 'react-events/tap',
entry: 'react-ui/events/tap',
global: 'ReactEventsTap',
externals: ['react'],
},
Expand Down
1 change: 1 addition & 0 deletions scripts/shared/pathsByLanguageVersion.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ const esNextPaths = [
'packages/*/*.js',
// Source files
'packages/*/src/**/*.js',
'packages/react-ui/*/src/**/*.js',
'packages/legacy-events/**/*.js',
'packages/shared/**/*.js',
// Shims and Flow environment
Expand Down