[react-interactions] Make FocusList bundle (#16876)
Dominic Gannaway committed
Sep 24, 2019 at 18:02 UTC
793f176dad4544363149098cc56eb2abff687fe2
7 files changed
+37
-17
packages/react-interactions/accessibility/focus-list.js
new
+12
@@ -0,0 +1,12 @@
1
+/**
2
+ * Copyright (c) Facebook, Inc. and its affiliates.
3
+ *
4
+ * This source code is licensed under the MIT license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ *
7
+ * @flow
8
+ */
9
+
10
+'use strict';
11
+
12
+module.exports = require('./src/FocusList');
packages/react-interactions/accessibility/src/FocusList.js
+3
-5
@@ -7,7 +7,7 @@
7
* @flow
8
*/
9
10
-import type {ReactScopeMethods} from 'shared/ReactTypes';
10
+import type {ReactScope, ReactScopeMethods} from 'shared/ReactTypes';
11
import type {KeyboardEvent} from 'react-interactions/events/keyboard';
12
13
import React from 'react';
@@ -59,10 +59,8 @@ function getNextListItem(
59
return null;
60
}
61
62
-export function createFocusList(
63
- scopeImpl: (type: string, props: Object) => boolean,
64
-): Array<React.Component> {
65
- const TableScope = React.unstable_createScope(scopeImpl);
62
+export function createFocusList(scope: ReactScope): Array<React.Component> {
63
+ const TableScope = React.unstable_createScope(scope.fn);
64
65
function List({children, portrait}): FocusListProps {
66
return (
packages/react-interactions/accessibility/src/FocusTable.js
+3
-5
@@ -7,7 +7,7 @@
7
* @flow
8
*/
9
10
-import type {ReactScopeMethods} from 'shared/ReactTypes';
10
+import type {ReactScope, ReactScopeMethods} from 'shared/ReactTypes';
11
import type {KeyboardEvent} from 'react-interactions/events/keyboard';
12
13
import React from 'react';
@@ -127,10 +127,8 @@ function triggerNavigateOut(
127
}
128
}
129
130
-export function createFocusTable(
131
- scopeImpl: (type: string, props: Object) => boolean,
132
-): Array<React.Component> {
133
- const TableScope = React.unstable_createScope(scopeImpl);
130
+export function createFocusTable(scope: ReactScope): Array<React.Component> {
131
+ const TableScope = React.unstable_createScope(scope.fn);
132
133
function Table({children, onKeyboardOut, id}): FocusTableProps {
134
return (
packages/react-interactions/accessibility/src/TabbableScope.js
+1
-1
@@ -9,7 +9,7 @@
9
10
import React from 'react';
11
12
-export const tabFocusableImpl = (type: string, props: Object): boolean => {
12
+const tabFocusableImpl = (type: string, props: Object): boolean => {
13
if (props.tabIndex === -1 || props.disabled) {
14
return false;
15
}
packages/react-interactions/accessibility/src/__tests__/FocusList-test.internal.js
+3
-3
@@ -12,7 +12,7 @@ import {createEventTarget} from 'react-interactions/events/src/dom/testing-libra
12
let React;
13
let ReactFeatureFlags;
14
let createFocusList;
15
-let tabFocusableImpl;
15
+let TabbableScope;
16
17
describe('FocusList', () => {
18
beforeEach(() => {
@@ -21,7 +21,7 @@ describe('FocusList', () => {
21
ReactFeatureFlags.enableScopeAPI = true;
22
ReactFeatureFlags.enableFlareAPI = true;
23
createFocusList = require('../FocusList').createFocusList;
24
- tabFocusableImpl = require('../TabbableScope').tabFocusableImpl;
24
+ TabbableScope = require('../TabbableScope').default;
25
React = require('react');
26
});
27
@@ -41,7 +41,7 @@ describe('FocusList', () => {
41
});
42
43
function createFocusListComponent() {
44
- const [FocusList, FocusItem] = createFocusList(tabFocusableImpl);
44
+ const [FocusList, FocusItem] = createFocusList(TabbableScope);
45
46
return ({portrait}) => (
47
<FocusList portrait={portrait}>
packages/react-interactions/accessibility/src/__tests__/FocusTable-test.internal.js
+3
-3
@@ -12,7 +12,7 @@ import {createEventTarget} from 'react-interactions/events/src/dom/testing-libra
12
let React;
13
let ReactFeatureFlags;
14
let createFocusTable;
15
-let tabFocusableImpl;
15
+let TabbableScope;
16
17
describe('FocusTable', () => {
18
beforeEach(() => {
@@ -21,7 +21,7 @@ describe('FocusTable', () => {
21
ReactFeatureFlags.enableScopeAPI = true;
22
ReactFeatureFlags.enableFlareAPI = true;
23
createFocusTable = require('../FocusTable').createFocusTable;
24
- tabFocusableImpl = require('../TabbableScope').tabFocusableImpl;
24
+ TabbableScope = require('../TabbableScope').default;
25
React = require('react');
26
});
27
@@ -42,7 +42,7 @@ describe('FocusTable', () => {
42
43
function createFocusTableComponent() {
44
const [FocusTable, FocusTableRow, FocusTableCell] = createFocusTable(
45
- tabFocusableImpl,
45
+ TabbableScope,
46
);
47
48
return ({onKeyboardOut, id}) => (
scripts/rollup/bundles.js
+12
@@ -706,6 +706,18 @@ const bundles = [
706
global: 'ReactTabbableScope',
707
externals: ['react'],
708
},
709
+
710
+ {
711
+ bundleTypes: [NODE_DEV, NODE_PROD, FB_WWW_DEV, FB_WWW_PROD],
712
+ moduleType: NON_FIBER_RENDERER,
713
+ entry: 'react-interactions/accessibility/focus-list',
714
+ global: 'ReactFocusList',
715
+ externals: [
716
+ 'react',
717
+ 'react-interactions/events/keyboard',
718
+ 'react-interactions/accessibility/tabbable-scope',
719
+ ],
720
+ },
721
];
722
723
const fbBundleExternalsMap = {