@samitouri / QOS-React / commits / a7d07ff24d

[react-interactions] Rename Flare listeners prop to DEPRECATED_flareListeners (#17394)

Dominic Gannaway committed Nov 18, 2019 at 13:32 UTC a7d07ff24d8d3d925ab45f5eb9be42a62a345dad
32 files changed +255 -201
packages/react-debug-tools/src/__tests__/ReactHooksInspection-test.internal.js
+1 -1
@@ -29,7 +29,7 @@ describe('ReactHooksInspection', () => {
29 const listener = React.unstable_useResponder(TestResponder, {
30 preventDefault: false,
31 });
32 - return <div listeners={listener}>Hello world</div>;
32 + return <div DEPRECATED_flareListeners={listener}>Hello world</div>;
33 }
34 let tree = ReactDebugTools.inspectHooks(Foo, {});
35 expect(tree).toEqual([
packages/react-dom/src/__tests__/ReactDOMServerPartialHydration-test.internal.js
+4 -4
@@ -1892,7 +1892,7 @@ describe('ReactDOMServerPartialHydration', () => {
1892
1893 function Button() {
1894 let listener = React.unstable_useResponder(TestResponder, {});
1895 - return <a listeners={listener}>Click me</a>;
1895 + return <a DEPRECATED_flareListeners={listener}>Click me</a>;
1896 }
1897
1898 function App() {
@@ -2041,7 +2041,7 @@ describe('ReactDOMServerPartialHydration', () => {
2041
2042 function Button() {
2043 let listener = React.unstable_useResponder(TestResponder, {});
2044 - return <a listeners={listener}>Click me</a>;
2044 + return <a DEPRECATED_flareListeners={listener}>Click me</a>;
2045 }
2046
2047 function Child() {
@@ -2408,13 +2408,13 @@ describe('ReactDOMServerPartialHydration', () => {
2408 return (
2409 <div>
2410 <Suspense fallback="Loading First...">
2411 - <span listeners={listener1} />
2411 + <span DEPRECATED_flareListeners={listener1} />
2412 {/* We suspend after to test what happens when we eager
2413 attach the listener. */}
2414 <First />
2415 </Suspense>
2416 <Suspense fallback="Loading Second...">
2417 - <span listeners={listener2}>
2417 + <span DEPRECATED_flareListeners={listener2}>
2418 <Second />
2419 </span>
2420 </Suspense>
packages/react-dom/src/client/ReactDOMComponent.js
+5 -5
@@ -103,7 +103,7 @@ const AUTOFOCUS = 'autoFocus';
103 const CHILDREN = 'children';
104 const STYLE = 'style';
105 const HTML = '__html';
106 -const LISTENERS = 'listeners';
106 +const DEPRECATED_flareListeners = 'DEPRECATED_flareListeners';
107
108 const {html: HTML_NAMESPACE} = Namespaces;
109
@@ -346,7 +346,7 @@ function setInitialDOMProperties(
346 setTextContent(domElement, '' + nextProp);
347 }
348 } else if (
349 - (enableFlareAPI && propKey === LISTENERS) ||
349 + (enableFlareAPI && propKey === DEPRECATED_flareListeners) ||
350 propKey === SUPPRESS_CONTENT_EDITABLE_WARNING ||
351 propKey === SUPPRESS_HYDRATION_WARNING
352 ) {
@@ -715,7 +715,7 @@ export function diffProperties(
715 } else if (propKey === DANGEROUSLY_SET_INNER_HTML || propKey === CHILDREN) {
716 // Noop. This is handled by the clear text mechanism.
717 } else if (
718 - (enableFlareAPI && propKey === LISTENERS) ||
718 + (enableFlareAPI && propKey === DEPRECATED_flareListeners) ||
719 propKey === SUPPRESS_CONTENT_EDITABLE_WARNING ||
720 propKey === SUPPRESS_HYDRATION_WARNING
721 ) {
@@ -810,7 +810,7 @@ export function diffProperties(
810 (updatePayload = updatePayload || []).push(propKey, '' + nextProp);
811 }
812 } else if (
813 - (enableFlareAPI && propKey === LISTENERS) ||
813 + (enableFlareAPI && propKey === DEPRECATED_flareListeners) ||
814 propKey === SUPPRESS_CONTENT_EDITABLE_WARNING ||
815 propKey === SUPPRESS_HYDRATION_WARNING
816 ) {
@@ -1065,7 +1065,7 @@ export function diffHydratedProperties(
1065 if (suppressHydrationWarning) {
1066 // Don't bother comparing. We're ignoring all these warnings.
1067 } else if (
1068 - (enableFlareAPI && propKey === LISTENERS) ||
1068 + (enableFlareAPI && propKey === DEPRECATED_flareListeners) ||
1069 propKey === SUPPRESS_CONTENT_EDITABLE_WARNING ||
1070 propKey === SUPPRESS_HYDRATION_WARNING ||
1071 // Controlled attributes are not validated
packages/react-dom/src/events/__tests__/DOMEventResponderSystem-test.internal.js
+37 -33
@@ -96,7 +96,7 @@ describe('DOMEventResponderSystem', () => {
96 function Test() {
97 const listener = React.unstable_useResponder(TestResponder, {});
98
99 - return <div listeners={listener}>Hello world</div>;
99 + return <div DEPRECATED_flareListeners={listener}>Hello world</div>;
100 }
101 const renderer = ReactTestRenderer.create(<Test />);
102 expect(renderer).toMatchRenderedOutput(<div>Hello world</div>);
@@ -108,7 +108,7 @@ describe('DOMEventResponderSystem', () => {
108 function Test() {
109 const listener = React.unstable_useResponder(TestResponder, {});
110
111 - return <div listeners={listener}>Hello world</div>;
111 + return <div DEPRECATED_flareListeners={listener}>Hello world</div>;
112 }
113 const output = ReactDOMServer.renderToString(<Test />);
114 expect(output).toBe(`<div data-reactroot="">Hello world</div>`);
@@ -127,7 +127,7 @@ describe('DOMEventResponderSystem', () => {
127
128 return (
129 <div>
130 - <span listeners={listener} ref={ref}>
130 + <span DEPRECATED_flareListeners={listener} ref={ref}>
131 Hello world
132 </span>
133 </div>
@@ -165,7 +165,7 @@ describe('DOMEventResponderSystem', () => {
165 const listener = React.unstable_useResponder(TestResponder, {});
166
167 return (
168 - <button ref={buttonRef} listeners={listener}>
168 + <button ref={buttonRef} DEPRECATED_flareListeners={listener}>
169 Click me!
170 </button>
171 );
@@ -225,7 +225,7 @@ describe('DOMEventResponderSystem', () => {
225 const listener = React.unstable_useResponder(TestResponder, {});
226
227 return (
228 - <button ref={buttonRef} listeners={listener}>
228 + <button ref={buttonRef} DEPRECATED_flareListeners={listener}>
229 Click me!
230 </button>
231 );
@@ -270,7 +270,9 @@ describe('DOMEventResponderSystem', () => {
270 const listener2 = React.unstable_useResponder(TestResponder, {});
271
272 return (
273 - <button ref={buttonRef} listeners={[listener, listener2]}>
273 + <button
274 + ref={buttonRef}
275 + DEPRECATED_flareListeners={[listener, listener2]}>
276 Click me!
277 </button>
278 );
@@ -304,8 +306,8 @@ describe('DOMEventResponderSystem', () => {
306 const listener = React.unstable_useResponder(TestResponder, {});
307
308 return (
307 - <div listeners={listener}>
308 - <button ref={buttonRef} listeners={listener}>
309 + <div DEPRECATED_flareListeners={listener}>
310 + <button ref={buttonRef} DEPRECATED_flareListeners={listener}>
311 Click me!
312 </button>
313 </div>
@@ -353,7 +355,9 @@ describe('DOMEventResponderSystem', () => {
355 const listener2 = React.unstable_useResponder(TestResponderB, {});
356
357 return (
356 - <button ref={buttonRef} listeners={[listener, listener2]}>
358 + <button
359 + ref={buttonRef}
360 + DEPRECATED_flareListeners={[listener, listener2]}>
361 Click me!
362 </button>
363 );
@@ -374,8 +378,8 @@ describe('DOMEventResponderSystem', () => {
378 const listener2 = React.unstable_useResponder(TestResponderB, {});
379
380 return (
377 - <div listeners={listener}>
378 - <button ref={buttonRef} listeners={listener2}>
381 + <div DEPRECATED_flareListeners={listener}>
382 + <button ref={buttonRef} DEPRECATED_flareListeners={listener2}>
383 Click me!
384 </button>
385 </div>
@@ -406,8 +410,8 @@ describe('DOMEventResponderSystem', () => {
410 const listener = React.unstable_useResponder(TestResponder, {name: 'A'});
411 const listener2 = React.unstable_useResponder(TestResponder, {name: 'B'});
412 return (
409 - <div listeners={listener}>
410 - <button ref={buttonRef} listeners={listener2}>
413 + <div DEPRECATED_flareListeners={listener}>
414 + <button ref={buttonRef} DEPRECATED_flareListeners={listener2}>
415 Click me!
416 </button>
417 </div>
@@ -454,7 +458,7 @@ describe('DOMEventResponderSystem', () => {
458 });
459
460 return (
457 - <button ref={buttonRef} listeners={listener}>
461 + <button ref={buttonRef} DEPRECATED_flareListeners={listener}>
462 Click me!
463 </button>
464 );
@@ -490,9 +494,9 @@ describe('DOMEventResponderSystem', () => {
494 const listener = React.unstable_useResponder(TestResponder, {});
495 const listener2 = React.unstable_useResponder(TestResponder2, {});
496 if (toggle) {
493 - return <button listeners={[listener2, listener]} />;
497 + return <button DEPRECATED_flareListeners={[listener2, listener]} />;
498 }
495 - return <button listeners={[listener, listener2]} />;
499 + return <button DEPRECATED_flareListeners={[listener, listener2]} />;
500 }
501
502 ReactDOM.render(<Test />, container);
@@ -515,15 +519,15 @@ describe('DOMEventResponderSystem', () => {
519 function Test({test}) {
520 const listener = React.unstable_useResponder(TestResponder, {});
521 if (test === 0) {
518 - return <button listeners={[listener]} />;
522 + return <button DEPRECATED_flareListeners={[listener]} />;
523 } else if (test === 1) {
520 - return <button listeners={null} />;
524 + return <button DEPRECATED_flareListeners={null} />;
525 } else if (test === 2) {
522 - return <button listeners={[]} />;
526 + return <button DEPRECATED_flareListeners={[]} />;
527 } else if (test === 3) {
528 return <button />;
529 } else if (test === 4) {
526 - return <button listeners={listener} />;
530 + return <button DEPRECATED_flareListeners={listener} />;
531 }
532 }
533
@@ -563,7 +567,7 @@ describe('DOMEventResponderSystem', () => {
567
568 const Test = () => {
569 const listener = React.unstable_useResponder(TestResponder, {});
566 - return <button listeners={listener} />;
570 + return <button DEPRECATED_flareListeners={listener} />;
571 };
572
573 ReactDOM.render(<Test />, container);
@@ -590,7 +594,7 @@ describe('DOMEventResponderSystem', () => {
594
595 const Test = () => {
596 const listener = React.unstable_useResponder(TestResponder, {});
593 - return <button listeners={listener}>Click me!</button>;
597 + return <button DEPRECATED_flareListeners={listener}>Click me!</button>;
598 };
599
600 ReactDOM.render(<Test />, container);
@@ -645,8 +649,8 @@ describe('DOMEventResponderSystem', () => {
649 const listener2 = React.unstable_useResponder(TestResponderB, {});
650
651 return (
648 - <div listeners={listener}>
649 - <button ref={buttonRef} listeners={listener2}>
652 + <div DEPRECATED_flareListeners={listener}>
653 + <button ref={buttonRef} DEPRECATED_flareListeners={listener2}>
654 Click me!
655 </button>
656 </div>
@@ -709,8 +713,8 @@ describe('DOMEventResponderSystem', () => {
713 const listener2 = React.unstable_useResponder(TestResponderB, {});
714
715 return (
712 - <div listeners={listener}>
713 - <button listeners={listener2}>Click me!</button>
716 + <div DEPRECATED_flareListeners={listener}>
717 + <button DEPRECATED_flareListeners={listener2}>Click me!</button>
718 </div>
719 );
720 };
@@ -759,7 +763,7 @@ describe('DOMEventResponderSystem', () => {
763 });
764
765 return (
762 - <button listeners={listener} ref={buttonRef}>
766 + <button DEPRECATED_flareListeners={listener} ref={buttonRef}>
767 Click me!
768 </button>
769 );
@@ -823,7 +827,7 @@ describe('DOMEventResponderSystem', () => {
827 onFoo: e => eventLogs.push('hook'),
828 });
829
826 - return <button ref={buttonRef} listeners={listener} />;
830 + return <button ref={buttonRef} DEPRECATED_flareListeners={listener} />;
831 };
832
833 ReactDOM.render(<Test />, container);
@@ -838,7 +842,7 @@ describe('DOMEventResponderSystem', () => {
842 onFoo: e => eventLogs.push('hook'),
843 });
844
841 - return <button ref={buttonRef} listeners={listener} />;
845 + return <button ref={buttonRef} DEPRECATED_flareListeners={listener} />;
846 };
847
848 ReactDOM.render(<Test2 />, container);
@@ -859,7 +863,7 @@ describe('DOMEventResponderSystem', () => {
863 const listener = React.unstable_useResponder(TestResponder, {counter});
864 Scheduler.unstable_yieldValue('Test');
865 return (
862 - <button listeners={listener} ref={ref}>
866 + <button DEPRECATED_flareListeners={listener} ref={ref}>
867 Press me
868 </button>
869 );
@@ -927,7 +931,7 @@ describe('DOMEventResponderSystem', () => {
931 const listener = React.unstable_useResponder(TestResponder, {
932 onClick: logEvent,
933 });
930 - return <button ref={ref} listeners={listener} />;
934 + return <button ref={ref} DEPRECATED_flareListeners={listener} />;
935 };
936 ReactDOM.render(<Component />, container);
937 dispatchClickEvent(ref.current);
@@ -970,7 +974,7 @@ describe('DOMEventResponderSystem', () => {
974 const Component = () => {
975 const listener = React.unstable_useResponder(TestResponder, {});
976 return (
973 - <div listeners={listener}>
977 + <div DEPRECATED_flareListeners={listener}>
978 {ReactDOM.createPortal(<button ref={buttonRef} />, domNode)}
979 </div>
980 );
@@ -994,7 +998,7 @@ describe('DOMEventResponderSystem', () => {
998 const Component = () => {
999 const listener = React.unstable_useResponder(TestResponder, {});
1000 return (
997 - <div listeners={listener}>
1001 + <div DEPRECATED_flareListeners={listener}>
1002 {ReactDOM.createPortal(<button ref={buttonRef} />, domNode)}
1003 </div>
1004 );
packages/react-dom/src/server/ReactPartialRenderer.js
+1 -1
@@ -370,7 +370,7 @@ function createOpenTagMarkup(
370 if (!hasOwnProperty.call(props, propKey)) {
371 continue;
372 }
373 - if (enableFlareAPI && propKey === 'listeners') {
373 + if (enableFlareAPI && propKey === 'DEPRECATED_flareListeners') {
374 continue;
375 }
376 let propValue = props[propKey];
packages/react-dom/src/shared/DOMProperty.js
+8 -2
@@ -8,6 +8,7 @@
8 */
9
10 import warning from 'shared/warning';
11 +import {enableFlareAPI} from 'shared/ReactFeatureFlags';
12
13 type PropertyType = 0 | 1 | 2 | 3 | 4 | 5 | 6;
14
@@ -207,7 +208,7 @@ function PropertyInfoRecord(
208 const properties = {};
209
210 // These props are reserved by React. They shouldn't be written to the DOM.
210 -[
211 +const reservedProps = [
212 'children',
213 'dangerouslySetInnerHTML',
214 // TODO: This prevents the assignment of defaultValue to regular
@@ -219,7 +220,12 @@ const properties = {};
220 'suppressContentEditableWarning',
221 'suppressHydrationWarning',
222 'style',
222 -].forEach(name => {
223 +];
224 +if (enableFlareAPI) {
225 + reservedProps.push('DEPRECATED_flareListeners');
226 +}
227 +
228 +reservedProps.forEach(name => {
229 properties[name] = new PropertyInfoRecord(
230 name,
231 RESERVED,
packages/react-dom/src/shared/ReactControlledValuePropTypes.js
+2 -2
@@ -36,7 +36,7 @@ if (__DEV__) {
36 props.readOnly ||
37 props.disabled ||
38 props[propName] == null ||
39 - (enableFlareAPI && props.listeners)
39 + (enableFlareAPI && props.DEPRECATED_flareListeners)
40 ) {
41 return null;
42 }
@@ -53,7 +53,7 @@ if (__DEV__) {
53 props.readOnly ||
54 props.disabled ||
55 props[propName] == null ||
56 - (enableFlareAPI && props.listeners)
56 + (enableFlareAPI && props.DEPRECATED_flareListeners)
57 ) {
58 return null;
59 }
packages/react-interactions/accessibility/src/FocusContain.js
+3 -1
@@ -82,7 +82,9 @@ export default function FocusContain({
82 );
83
84 return (
85 - <FocusContainScope ref={scopeRef} listeners={[keyboard, focusWithin]}>
85 + <FocusContainScope
86 + ref={scopeRef}
87 + DEPRECATED_flareListeners={[keyboard, focusWithin]}>
88 {children}
89 </FocusContainScope>
90 );
packages/react-interactions/accessibility/src/FocusGroup.js
+4 -1
@@ -217,7 +217,10 @@ export function createFocusGroup(
217 },
218 });
219 return (
220 - <TableScope listeners={keyboard} ref={scopeRef} type="item">
220 + <TableScope
221 + DEPRECATED_flareListeners={keyboard}
222 + ref={scopeRef}
223 + type="item">
224 {children}
225 </TableScope>
226 );
packages/react-interactions/accessibility/src/FocusTable.js
+1 -1
@@ -346,7 +346,7 @@ export function createFocusTable(
346 });
347 return (
348 <TableScope
349 - listeners={keyboard}
349 + DEPRECATED_flareListeners={keyboard}
350 ref={scopeRef}
351 type="cell"
352 colSpan={colSpan}>
packages/react-interactions/events/docs/ContextMenu.md
+1 -1
@@ -12,7 +12,7 @@ const Button = (props) => {
12 });
13
14 return (
15 - <div listeners={contextmenu}>
15 + <div DEPRECATED_flareListeners={contextmenu}>
16 {props.children}
17 </div>
18 );
packages/react-interactions/events/docs/Focus.md
+1 -1
@@ -19,7 +19,7 @@ const Button = (props) => {
19 return (
20 <button
21 children={props.children}
22 - listeners={focus}
22 + DEPRECATED_flareListeners={focus}
23 style={{
24 ...(isFocusVisible && focusVisibleStyles)
25 }}
packages/react-interactions/events/docs/FocusWithin.md
+1 -1
@@ -19,7 +19,7 @@ const Button = (props) => {
19 return (
20 <button
21 children={props.children}
22 - listeners={focusWithin}
22 + DEPRECATED_flareListeners={focusWithin}
23 style={{
24 ...(isFocusWithin && focusWithinStyles),
25 ...(isFocusWithinVisible && focusWithinVisibleStyles)
packages/react-interactions/events/docs/Hover.md
+1 -1
@@ -18,7 +18,7 @@ const Link = (props) => (
18 <a
19 {...props}
20 href={props.href}
21 - listeners={hover}
21 + DEPRECATED_flareListeners={hover}
22 style={{
23 ...props.style,
24 textDecoration: isHovered ? 'underline': 'none'
packages/react-interactions/events/docs/Press.md
+1 -1
@@ -21,7 +21,7 @@ const Button = (props) => (
21 return (
22 <div
23 {...props}
24 - listeners={press}
24 + DEPRECATED_flareListeners={press}
25 role="button"
26 tabIndex={0}
27 style={
packages/react-interactions/events/src/dom/__tests__/ContextMenu-test.internal.js
+6 -6
@@ -57,7 +57,7 @@ describe.each(table)('ContextMenu responder', hasPointerEvents => {
57 const ref = React.createRef();
58 const Component = () => {
59 const listener = useContextMenu({onContextMenu});
60 - return <div ref={ref} listeners={listener} />;
60 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
61 };
62 ReactDOM.render(<Component />, container);
63
@@ -80,7 +80,7 @@ describe.each(table)('ContextMenu responder', hasPointerEvents => {
80 const ref = React.createRef();
81 const Component = () => {
82 const listener = useContextMenu({onContextMenu});
83 - return <div ref={ref} listeners={listener} />;
83 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
84 };
85 ReactDOM.render(<Component />, container);
86
@@ -105,7 +105,7 @@ describe.each(table)('ContextMenu responder', hasPointerEvents => {
105 onContextMenu,
106 disabled: true,
107 });
108 - return <div ref={ref} listeners={listener} />;
108 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
109 };
110 ReactDOM.render(<Component />, container);
111
@@ -123,7 +123,7 @@ describe.each(table)('ContextMenu responder', hasPointerEvents => {
123 onContextMenu,
124 preventDefault: false,
125 });
126 - return <div ref={ref} listeners={listener} />;
126 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
127 };
128 ReactDOM.render(<Component />, container);
129
@@ -149,7 +149,7 @@ describe.each(table)('ContextMenu responder', hasPointerEvents => {
149 const ref = React.createRef();
150 const Component = () => {
151 const listener = useContextMenu({onContextMenu});
152 - return <div ref={ref} listeners={listener} />;
152 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
153 };
154 ReactDOM.render(<Component />, container);
155
@@ -181,7 +181,7 @@ describe.each(table)('ContextMenu responder', hasPointerEvents => {
181 const ref = React.createRef();
182 const Component = () => {
183 const listener = useContextMenu({onContextMenu});
184 - return <div ref={ref} listeners={listener} />;
184 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
185 };
186 ReactDOM.render(<Component />, container);
187
packages/react-interactions/events/src/dom/__tests__/Drag-test.internal.js
+3 -3
@@ -48,7 +48,7 @@ describe('Drag event responder', () => {
48 onDragChange: handleOnDrag,
49 });
50 return (
51 - <div ref={divRef} listeners={listener}>
51 + <div ref={divRef} DEPRECATED_flareListeners={listener}>
52 Drag me!
53 </div>
54 );
@@ -105,7 +105,7 @@ describe('Drag event responder', () => {
105 onDragEnd: handleDragEnd,
106 });
107 return (
108 - <div ref={divRef} listeners={listener}>
108 + <div ref={divRef} DEPRECATED_flareListeners={listener}>
109 Drag me!
110 </div>
111 );
@@ -157,7 +157,7 @@ describe('Drag event responder', () => {
157 onDragMove: handleDragMove,
158 });
159 return (
160 - <div ref={divRef} listeners={listener}>
160 + <div ref={divRef} DEPRECATED_flareListeners={listener}>
161 Drag me!
162 </div>
163 );
packages/react-interactions/events/src/dom/__tests__/Focus-test.internal.js
+7 -7
@@ -59,7 +59,7 @@ describe.each(table)('Focus responder', hasPointerEvents => {
59 onBlur,
60 onFocus,
61 });
62 - return <div ref={ref} listeners={listener} />;
62 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
63 };
64 ReactDOM.render(<Component />, container);
65 });
@@ -83,7 +83,7 @@ describe.each(table)('Focus responder', hasPointerEvents => {
83 const listener = useFocus({
84 onBlur,
85 });
86 - return <div ref={ref} listeners={listener} />;
86 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
87 };
88 ReactDOM.render(<Component />, container);
89 });
@@ -108,7 +108,7 @@ describe.each(table)('Focus responder', hasPointerEvents => {
108 onFocus,
109 });
110 return (
111 - <div ref={ref} listeners={listener}>
111 + <div ref={ref} DEPRECATED_flareListeners={listener}>
112 <a ref={innerRef} />
113 </div>
114 );
@@ -207,7 +207,7 @@ describe.each(table)('Focus responder', hasPointerEvents => {
207 onFocusChange,
208 });
209 return (
210 - <div ref={ref} listeners={listener}>
210 + <div ref={ref} DEPRECATED_flareListeners={listener}>
211 <div ref={innerRef} />
212 </div>
213 );
@@ -246,7 +246,7 @@ describe.each(table)('Focus responder', hasPointerEvents => {
246 onFocusVisibleChange,
247 });
248 return (
249 - <div ref={ref} listeners={listener}>
249 + <div ref={ref} DEPRECATED_flareListeners={listener}>
250 <div ref={innerRef} />
251 </div>
252 );
@@ -320,7 +320,7 @@ describe.each(table)('Focus responder', hasPointerEvents => {
320 onFocus: createEventHandler('inner: onFocus'),
321 onFocusChange: createEventHandler('inner: onFocusChange'),
322 });
323 - return <div ref={innerRef} listeners={listener} />;
323 + return <div ref={innerRef} DEPRECATED_flareListeners={listener} />;
324 };
325
326 const Outer = () => {
@@ -330,7 +330,7 @@ describe.each(table)('Focus responder', hasPointerEvents => {
330 onFocusChange: createEventHandler('outer: onFocusChange'),
331 });
332 return (
333 - <div ref={outerRef} listeners={listener}>
333 + <div ref={outerRef} DEPRECATED_flareListeners={listener}>
334 <Inner />
335 </div>
336 );
packages/react-interactions/events/src/dom/__tests__/FocusWithin-test.internal.js
+5 -5
@@ -60,7 +60,7 @@ describe.each(table)('FocusWithin responder', hasPointerEvents => {
60 onFocusWithinChange,
61 onFocusWithinVisibleChange,
62 });
63 - return <div ref={ref} listeners={listener} />;
63 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
64 };
65 ReactDOM.render(<Component />, container);
66 });
@@ -82,7 +82,7 @@ describe.each(table)('FocusWithin responder', hasPointerEvents => {
82 onFocusWithinChange,
83 });
84 return (
85 - <div ref={ref} listeners={listener}>
85 + <div ref={ref} DEPRECATED_flareListeners={listener}>
86 {show && <input ref={innerRef} />}
87 <div ref={innerRef2} />
88 </div>
@@ -151,7 +151,7 @@ describe.each(table)('FocusWithin responder', hasPointerEvents => {
151 onFocusWithinVisibleChange,
152 });
153 return (
154 - <div ref={ref} listeners={listener}>
154 + <div ref={ref} DEPRECATED_flareListeners={listener}>
155 {show && <input ref={innerRef} />}
156 <div ref={innerRef2} />
157 </div>
@@ -280,7 +280,7 @@ describe.each(table)('FocusWithin responder', hasPointerEvents => {
280 onBlurWithin,
281 });
282 return (
283 - <div ref={ref} listeners={listener}>
283 + <div ref={ref} DEPRECATED_flareListeners={listener}>
284 {show && <input ref={innerRef} />}
285 <div ref={innerRef2} />
286 </div>
@@ -310,7 +310,7 @@ describe.each(table)('FocusWithin responder', hasPointerEvents => {
310 onBlurWithin,
311 });
312 return (
313 - <div ref={ref} listeners={listener}>
313 + <div ref={ref} DEPRECATED_flareListeners={listener}>
314 {show && (
315 <div>
316 <input ref={innerRef} />
packages/react-interactions/events/src/dom/__tests__/Hover-test.internal.js
+8 -8
@@ -63,7 +63,7 @@ describe.each(table)('Hover responder', hasPointerEvents => {
63 onHoverMove,
64 onHoverEnd,
65 });
66 - return <div ref={ref} listeners={listener} />;
66 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
67 };
68 ReactDOM.render(<Component />, container);
69 });
@@ -89,7 +89,7 @@ describe.each(table)('Hover responder', hasPointerEvents => {
89 const listener = useHover({
90 onHoverStart: onHoverStart,
91 });
92 - return <div ref={ref} listeners={listener} />;
92 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
93 };
94 ReactDOM.render(<Component />, container);
95 });
@@ -126,7 +126,7 @@ describe.each(table)('Hover responder', hasPointerEvents => {
126 const listener = useHover({
127 onHoverChange,
128 });
129 - return <div ref={ref} listeners={listener} />;
129 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
130 };
131 ReactDOM.render(<Component />, container);
132 });
@@ -159,7 +159,7 @@ describe.each(table)('Hover responder', hasPointerEvents => {
159 const listener = useHover({
160 onHoverEnd,
161 });
162 - return <div ref={ref} listeners={listener} />;
162 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
163 };
164 ReactDOM.render(<Component />, container);
165 });
@@ -203,7 +203,7 @@ describe.each(table)('Hover responder', hasPointerEvents => {
203 const listener = useHover({
204 onHoverMove,
205 });
206 - return <div ref={ref} listeners={listener} />;
206 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
207 };
208 ReactDOM.render(<Component />, container);
209
@@ -233,7 +233,7 @@ describe.each(table)('Hover responder', hasPointerEvents => {
233 onHoverEnd: createEventHandler('inner: onHoverEnd'),
234 onHoverChange: createEventHandler('inner: onHoverChange'),
235 });
236 - return <div ref={innerRef} listeners={listener} />;
236 + return <div ref={innerRef} DEPRECATED_flareListeners={listener} />;
237 };
238
239 const Outer = () => {
@@ -243,7 +243,7 @@ describe.each(table)('Hover responder', hasPointerEvents => {
243 onHoverChange: createEventHandler('outer: onHoverChange'),
244 });
245 return (
246 - <div ref={outerRef} listeners={listener}>
246 + <div ref={outerRef} DEPRECATED_flareListeners={listener}>
247 <Inner />
248 </div>
249 );
@@ -309,7 +309,7 @@ describe.each(table)('Hover responder', hasPointerEvents => {
309 onHoverEnd: logEvent,
310 onHoverMove: logEvent,
311 });
312 - return <div ref={ref} listeners={listener} />;
312 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
313 };
314 ReactDOM.render(<Component />, container);
315
packages/react-interactions/events/src/dom/__tests__/Input-test.internal.js
+57 -19
@@ -72,7 +72,7 @@ describe('Input event responder', () => {
72 onChange,
73 onValueChange,
74 });
75 - return <input ref={ref} listeners={listener} />;
75 + return <input ref={ref} DEPRECATED_flareListeners={listener} />;
76 }
77 ReactDOM.render(<Component />, container);
78 });
@@ -123,7 +123,7 @@ describe('Input event responder', () => {
123 type="text"
124 ref={ref}
125 defaultValue="foo"
126 - listeners={listener}
126 + DEPRECATED_flareListeners={listener}
127 />
128 );
129 }
@@ -163,7 +163,7 @@ describe('Input event responder', () => {
163 type="checkbox"
164 ref={ref}
165 defaultChecked={true}
166 - listeners={listener}
166 + DEPRECATED_flareListeners={listener}
167 />
168 );
169 }
@@ -206,7 +206,7 @@ describe('Input event responder', () => {
206 type="checkbox"
207 ref={ref}
208 defaultChecked={false}
209 - listeners={listener}
209 + DEPRECATED_flareListeners={listener}
210 />
211 );
212 }
@@ -243,7 +243,13 @@ describe('Input event responder', () => {
243 onChange,
244 onValueChange,
245 });
246 - return <input type="checkbox" ref={ref} listeners={listener} />;
246 + return (
247 + <input
248 + type="checkbox"
249 + ref={ref}
250 + DEPRECATED_flareListeners={listener}
251 + />
252 + );
253 }
254 ReactDOM.render(<Component />, container);
255
@@ -289,7 +295,7 @@ describe('Input event responder', () => {
295 type="text"
296 defaultValue="foo"
297 ref={ref}
292 - listeners={listener}
298 + DEPRECATED_flareListeners={listener}
299 />
300 );
301 }
@@ -347,7 +353,12 @@ describe('Input event responder', () => {
353 onValueChange,
354 });
355 return (
350 - <input type="text" defaultValue="42" ref={ref} listeners={listener} />
356 + <input
357 + type="text"
358 + defaultValue="42"
359 + ref={ref}
360 + DEPRECATED_flareListeners={listener}
361 + />
362 );
363 }
364 ReactDOM.render(<Component />, container);
@@ -391,7 +402,7 @@ describe('Input event responder', () => {
402 type="checkbox"
403 defaultChecked={false}
404 ref={ref}
394 - listeners={listener}
405 + DEPRECATED_flareListeners={listener}
406 />
407 );
408 }
@@ -439,7 +450,9 @@ describe('Input event responder', () => {
450 onChange,
451 onValueChange,
452 });
442 - return <input type="radio" ref={ref} listeners={listener} />;
453 + return (
454 + <input type="radio" ref={ref} DEPRECATED_flareListeners={listener} />
455 + );
456 }
457 ReactDOM.render(<Component />, container);
458
@@ -484,7 +497,13 @@ describe('Input event responder', () => {
497 onChange: onChange1,
498 onValueChange: onValueChange1,
499 });
487 - return <input type="radio" name="group" listeners={listener} />;
500 + return (
501 + <input
502 + type="radio"
503 + name="group"
504 + DEPRECATED_flareListeners={listener}
505 + />
506 + );
507 }
508
509 function Radio2() {
@@ -492,7 +511,13 @@ describe('Input event responder', () => {
511 onChange: onChange2,
512 onValueChange: onValueChange2,
513 });
495 - return <input type="radio" name="group" listeners={listener} />;
514 + return (
515 + <input
516 + type="radio"
517 + name="group"
518 + DEPRECATED_flareListeners={listener}
519 + />
520 + );
521 }
522
523 function Component() {
@@ -560,7 +585,12 @@ describe('Input event responder', () => {
585 onValueChange,
586 });
587 return (
563 - <input type={type} name="group" ref={ref} listeners={listener} />
588 + <input
589 + type={type}
590 + name="group"
591 + ref={ref}
592 + DEPRECATED_flareListeners={listener}
593 + />
594 );
595 }
596 ReactDOM.render(<Component />, container);
@@ -587,7 +617,9 @@ describe('Input event responder', () => {
617 onChange,
618 onValueChange,
619 });
590 - return <input type={type} ref={ref} listeners={listener} />;
620 + return (
621 + <input type={type} ref={ref} DEPRECATED_flareListeners={listener} />
622 + );
623 }
624 ReactDOM.render(<Component2 />, container);
625 // Should be ignored (no change):
@@ -613,7 +645,9 @@ describe('Input event responder', () => {
645 onChange,
646 onValueChange,
647 });
616 - return <input type={type} ref={ref} listeners={listener} />;
648 + return (
649 + <input type={type} ref={ref} DEPRECATED_flareListeners={listener} />
650 + );
651 }
652 ReactDOM.render(<Component3 />, container);
653 // Should be ignored (no change):
@@ -653,7 +687,9 @@ describe('Input event responder', () => {
687 onChange,
688 onValueChange,
689 });
656 - return <input type="range" ref={ref} listeners={listener} />;
690 + return (
691 + <input type="range" ref={ref} DEPRECATED_flareListeners={listener} />
692 + );
693 }
694 ReactDOM.render(<Component />, container);
695
@@ -690,7 +726,9 @@ describe('Input event responder', () => {
726 onChange,
727 onValueChange,
728 });
693 - return <input type="range" ref={ref} listeners={listener} />;
729 + return (
730 + <input type="range" ref={ref} DEPRECATED_flareListeners={listener} />
731 + );
732 }
733 ReactDOM.render(<Component />, container);
734
@@ -766,7 +804,7 @@ describe('Input event responder', () => {
804 type="text"
805 ref={innerRef}
806 value={controlledValue}
769 - listeners={listener}
807 + DEPRECATED_flareListeners={listener}
808 />
809 );
810 }
@@ -826,7 +864,7 @@ describe('Input event responder', () => {
864 type="checkbox"
865 ref={innerRef}
866 checked={controlledValue}
829 - listeners={listener}
867 + DEPRECATED_flareListeners={listener}
868 />
869 );
870 }
@@ -901,7 +939,7 @@ describe('Input event responder', () => {
939 type="text"
940 ref={innerRef}
941 value={controlledValue}
904 - listeners={listener}
942 + DEPRECATED_flareListeners={listener}
943 />
944 );
945 }
packages/react-interactions/events/src/dom/__tests__/Keyboard-test.internal.js
+8 -8
@@ -60,8 +60,8 @@ describe('Keyboard responder', () => {
60 onKeyUp: onKeyUpOuter,
61 });
62 return (
63 - <div listeners={listenerOuter}>
64 - <div ref={ref} listeners={listenerInner} />
63 + <div DEPRECATED_flareListeners={listenerOuter}>
64 + <div ref={ref} DEPRECATED_flareListeners={listenerInner} />
65 </div>
66 );
67 };
@@ -130,7 +130,7 @@ describe('Keyboard responder', () => {
130 ref = React.createRef();
131 const Component = () => {
132 const listener = useKeyboard({disabled: true, onKeyDown, onKeyUp});
133 - return <div ref={ref} listeners={listener} />;
133 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
134 };
135 ReactDOM.render(<Component />, container);
136 });
@@ -154,7 +154,7 @@ describe('Keyboard responder', () => {
154 ref = React.createRef();
155 const Component = () => {
156 const listener = useKeyboard({onClick});
157 - return <div ref={ref} listeners={listener} />;
157 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
158 };
159 ReactDOM.render(<Component />, container);
160 });
@@ -232,7 +232,7 @@ describe('Keyboard responder', () => {
232 ref = React.createRef();
233 const Component = () => {
234 const listener = useKeyboard({onKeyDown});
235 - return <div ref={ref} listeners={listener} />;
235 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
236 };
237 ReactDOM.render(<Component />, container);
238 });
@@ -293,7 +293,7 @@ describe('Keyboard responder', () => {
293 ref = React.createRef();
294 const Component = () => {
295 const listener = useKeyboard({onKeyUp});
296 - return <div ref={ref} listeners={listener} />;
296 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
297 };
298 ReactDOM.render(<Component />, container);
299 });
@@ -353,7 +353,7 @@ describe('Keyboard responder', () => {
353 const ref = React.createRef();
354 const Component = () => {
355 const listener = useKeyboard(props);
356 - return <div ref={ref} listeners={listener} />;
356 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
357 };
358 ReactDOM.render(<Component />, container);
359 return ref;
@@ -398,7 +398,7 @@ describe('Keyboard responder', () => {
398 const ref = React.createRef();
399 const Component = () => {
400 const listener = useKeyboard(props);
401 - return <div ref={ref} listeners={listener} />;
401 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
402 };
403 ReactDOM.render(<Component />, container);
404 return ref;
packages/react-interactions/events/src/dom/__tests__/MixedResponders-test-internal.js
+4 -4
@@ -60,7 +60,7 @@ describe('mixing responders with the heritage event system', () => {
60 <div>
61 <button
62 ref={ref}
63 - listeners={listener}
63 + DEPRECATED_flareListeners={listener}
64 onClick={() => {
65 updateCounter(count => count + 1);
66 }}>
@@ -129,7 +129,7 @@ describe('mixing responders with the heritage event system', () => {
129 <div>
130 <button
131 ref={ref}
132 - listeners={listener}
132 + DEPRECATED_flareListeners={listener}
133 onClick={() => {
134 // This should flush synchronously
135 ReactDOM.unstable_flushDiscreteUpdates();
@@ -210,7 +210,7 @@ describe('mixing responders with the heritage event system', () => {
210 return (
211 <div>
212 <button
213 - listeners={tap}
213 + DEPRECATED_flareListeners={tap}
214 ref={button}
215 onClick={() => updateClicksCount(clicksCount + 1)}>
216 Presses: {pressesCount}, Clicks: {clicksCount}
@@ -255,7 +255,7 @@ describe('mixing responders with the heritage event system', () => {
255 type="text"
256 ref={innerRef}
257 value={controlledValue}
258 - listeners={[inputListener, listeners]}
258 + DEPRECATED_flareListeners={[inputListener, listeners]}
259 />
260 );
261 }
packages/react-interactions/events/src/dom/__tests__/Press-test.internal.js
+15 -15
@@ -67,7 +67,7 @@ describeWithPointerEvent('Press responder', hasPointerEvents => {
67 onPressEnd,
68 onPress,
69 });
70 - return <div ref={ref} listeners={listener} />;
70 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
71 };
72 ReactDOM.render(<Component />, container);
73 });
@@ -105,7 +105,7 @@ describeWithPointerEvent('Press responder', hasPointerEvents => {
105 const listener = usePress({
106 onPressStart,
107 });
108 - return <div ref={ref} listeners={listener} />;
108 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
109 };
110 ReactDOM.render(<Component />, container);
111 document.elementFromPoint = () => ref.current;
@@ -190,7 +190,7 @@ describeWithPointerEvent('Press responder', hasPointerEvents => {
190 const listener = usePress({
191 onPressEnd,
192 });
193 - return <div ref={ref} listeners={listener} />;
193 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
194 };
195 ReactDOM.render(<Component />, container);
196 document.elementFromPoint = () => ref.current;
@@ -288,7 +288,7 @@ describeWithPointerEvent('Press responder', hasPointerEvents => {
288 const listener = usePress({
289 onPressChange,
290 });
291 - return <div ref={ref} listeners={listener} />;
291 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
292 };
293 ReactDOM.render(<Component />, container);
294 document.elementFromPoint = () => ref.current;
@@ -328,7 +328,7 @@ describeWithPointerEvent('Press responder', hasPointerEvents => {
328 const listener = usePress({
329 onPress,
330 });
331 - return <div ref={ref} listeners={listener} />;
331 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
332 };
333 ReactDOM.render(<Component />, container);
334 ref.current.getBoundingClientRect = () => ({
@@ -377,7 +377,7 @@ describeWithPointerEvent('Press responder', hasPointerEvents => {
377 const inputRef = React.createRef();
378 const Component = () => {
379 const listener = usePress({onPress});
380 - return <input ref={inputRef} listeners={listener} />;
380 + return <input ref={inputRef} DEPRECATED_flareListeners={listener} />;
381 };
382 ReactDOM.render(<Component />, container);
383 const target = createEventTarget(inputRef.current);
@@ -426,7 +426,7 @@ describeWithPointerEvent('Press responder', hasPointerEvents => {
426 const listener = usePress({
427 onPressMove,
428 });
429 - return <div ref={ref} listeners={listener} />;
429 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
430 };
431 ReactDOM.render(<Component />, container);
432 ref.current.getBoundingClientRect = () => ({
@@ -476,7 +476,7 @@ describeWithPointerEvent('Press responder', hasPointerEvents => {
476
477 const Component = () => {
478 const listener = usePress({onPress});
479 - return <a href="#" ref={ref} listeners={listener} />;
479 + return <a href="#" ref={ref} DEPRECATED_flareListeners={listener} />;
480 };
481 ReactDOM.render(<Component />, container);
482
@@ -497,7 +497,7 @@ describeWithPointerEvent('Press responder', hasPointerEvents => {
497
498 const Component = () => {
499 const listener = usePress({onPress});
500 - return <a href="#" ref={ref} listeners={listener} />;
500 + return <a href="#" ref={ref} DEPRECATED_flareListeners={listener} />;
501 };
502 ReactDOM.render(<Component />, container);
503
@@ -522,7 +522,7 @@ describeWithPointerEvent('Press responder', hasPointerEvents => {
522 const listener = usePress({onPress});
523 return (
524 <a href="#">
525 - <button ref={buttonRef} listeners={listener} />
525 + <button ref={buttonRef} DEPRECATED_flareListeners={listener} />
526 </a>
527 );
528 };
@@ -542,7 +542,7 @@ describeWithPointerEvent('Press responder', hasPointerEvents => {
542 const Component = () => {
543 const listener = usePress({onPress});
544 return (
545 - <a href="#" listeners={listener}>
545 + <a href="#" DEPRECATED_flareListeners={listener}>
546 <div ref={ref} />
547 </a>
548 );
@@ -565,7 +565,7 @@ describeWithPointerEvent('Press responder', hasPointerEvents => {
565
566 const Component = () => {
567 const listener = usePress({onPress});
568 - return <a href="#" ref={ref} listeners={listener} />;
568 + return <a href="#" ref={ref} DEPRECATED_flareListeners={listener} />;
569 };
570 ReactDOM.render(<Component />, container);
571
@@ -587,7 +587,7 @@ describeWithPointerEvent('Press responder', hasPointerEvents => {
587
588 const Component = () => {
589 const listener = usePress({onPress, preventDefault: false});
590 - return <a href="#" ref={ref} listeners={listener} />;
590 + return <a href="#" ref={ref} DEPRECATED_flareListeners={listener} />;
591 };
592 ReactDOM.render(<Component />, container);
593
@@ -607,7 +607,7 @@ describeWithPointerEvent('Press responder', hasPointerEvents => {
607
608 const Component = () => {
609 const listener = usePress({onPress, preventDefault: false});
610 - return <a href="#" ref={ref} listeners={listener} />;
610 + return <a href="#" ref={ref} DEPRECATED_flareListeners={listener} />;
611 };
612 ReactDOM.render(<Component />, container);
613
@@ -628,7 +628,7 @@ describeWithPointerEvent('Press responder', hasPointerEvents => {
628
629 const Component = () => {
630 const listener = usePress();
631 - return <button ref={ref} listeners={listener} />;
631 + return <button ref={ref} DEPRECATED_flareListeners={listener} />;
632 };
633 ReactDOM.render(<Component />, container);
634
packages/react-interactions/events/src/dom/__tests__/PressLegacy-test.internal.js
+31 -31
@@ -75,7 +75,7 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
75 onPress,
76 onPressEnd,
77 });
78 - return <div ref={ref} listeners={listener} />;
78 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
79 };
80 ReactDOM.render(<Component />, container);
81 document.elementFromPoint = () => ref.current;
@@ -101,7 +101,7 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
101 const listener = usePress({
102 onPressStart,
103 });
104 - return <div ref={ref} listeners={listener} />;
104 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
105 };
106 ReactDOM.render(<Component />, container);
107 document.elementFromPoint = () => ref.current;
@@ -201,7 +201,7 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
201 const listener = usePress({
202 onPressEnd,
203 });
204 - return <div ref={ref} listeners={listener} />;
204 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
205 };
206 ReactDOM.render(<Component />, container);
207 document.elementFromPoint = () => ref.current;
@@ -299,7 +299,7 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
299 const listener = usePress({
300 onPressChange,
301 });
302 - return <div ref={ref} listeners={listener} />;
302 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
303 };
304 ReactDOM.render(<Component />, container);
305 document.elementFromPoint = () => ref.current;
@@ -339,7 +339,7 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
339 const listener = usePress({
340 onPress,
341 });
342 - return <div ref={ref} listeners={listener} />;
342 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
343 };
344 ReactDOM.render(<Component />, container);
345 ref.current.getBoundingClientRect = () => ({
@@ -388,7 +388,7 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
388 const inputRef = React.createRef();
389 const Component = () => {
390 const listener = usePress({onPress});
391 - return <input ref={inputRef} listeners={listener} />;
391 + return <input ref={inputRef} DEPRECATED_flareListeners={listener} />;
392 };
393 ReactDOM.render(<Component />, container);
394 const target = createEventTarget(inputRef.current);
@@ -419,7 +419,7 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
419 const Component = () => {
420 const listener = usePress({onPress});
421 return (
422 - <div ref={divRef} listeners={listener}>
422 + <div ref={divRef} DEPRECATED_flareListeners={listener}>
423 <button ref={buttonRef} />
424 </div>
425 );
@@ -459,7 +459,7 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
459 const listener = usePress({
460 onPressMove,
461 });
462 - return <div ref={ref} listeners={listener} />;
462 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
463 };
464 ReactDOM.render(<Component />, container);
465 ref.current.getBoundingClientRect = () => ({
@@ -521,7 +521,7 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
521 });
522 return (
523 <div ref={outerRef}>
524 - <div ref={ref} listeners={listener} />
524 + <div ref={ref} DEPRECATED_flareListeners={listener} />
525 </div>
526 );
527 };
@@ -610,7 +610,7 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
610 onPressEnd: createEventHandler('onPressEnd'),
611 pressRetentionOffset,
612 });
613 - return <div ref={localRef} listeners={listener} />;
613 + return <div ref={localRef} DEPRECATED_flareListeners={listener} />;
614 };
615 ReactDOM.render(<Component />, container);
616
@@ -756,7 +756,7 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
756 return (
757 <div
758 ref={ref}
759 - listeners={listener}
759 + DEPRECATED_flareListeners={listener}
760 onPointerDown={createEventHandler('pointerdown')}
761 onPointerUp={createEventHandler('pointerup')}
762 onKeyDown={createEventHandler('keydown')}
@@ -774,7 +774,7 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
774 onPressEnd: createEventHandler('outer: onPressEnd'),
775 });
776 return (
777 - <div listeners={listener}>
777 + <div DEPRECATED_flareListeners={listener}>
778 <Inner />
779 </div>
780 );
@@ -804,13 +804,13 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
804
805 const Inner = () => {
806 const listener = usePress({onPress});
807 - return <div ref={ref} listeners={listener} />;
807 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
808 };
809
810 const Outer = () => {
811 const listener = usePress({onPress});
812 return (
813 - <div listeners={listener}>
813 + <div DEPRECATED_flareListeners={listener}>
814 <Inner />
815 </div>
816 );
@@ -831,13 +831,13 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
831
832 const Inner = () => {
833 const listener = usePress({onPressStart, onPressEnd});
834 - return <div ref={ref} listeners={listener} />;
834 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
835 };
836
837 const Outer = () => {
838 const listener = usePress({onPressStart, onPressEnd});
839 return (
840 - <div listeners={listener}>
840 + <div DEPRECATED_flareListeners={listener}>
841 <Inner />
842 </div>
843 );
@@ -859,13 +859,13 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
859
860 const Inner = () => {
861 const listener = usePress({onPressChange});
862 - return <div ref={ref} listeners={listener} />;
862 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
863 };
864
865 const Outer = () => {
866 const listener = usePress({onPressChange});
867 return (
868 - <div listeners={listener}>
868 + <div DEPRECATED_flareListeners={listener}>
869 <Inner />
870 </div>
871 );
@@ -889,7 +889,7 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
889
890 const Component = () => {
891 const listener = usePress({onPress});
892 - return <a href="#" ref={ref} listeners={listener} />;
892 + return <a href="#" ref={ref} DEPRECATED_flareListeners={listener} />;
893 };
894 ReactDOM.render(<Component />, container);
895
@@ -909,7 +909,7 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
909
910 const Component = () => {
911 const listener = usePress({onPress});
912 - return <a href="#" ref={ref} listeners={listener} />;
912 + return <a href="#" ref={ref} DEPRECATED_flareListeners={listener} />;
913 };
914 ReactDOM.render(<Component />, container);
915
@@ -931,7 +931,7 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
931 const listener = usePress({onPress});
932 return (
933 <a href="#">
934 - <button ref={buttonRef} listeners={listener} />
934 + <button ref={buttonRef} DEPRECATED_flareListeners={listener} />
935 </a>
936 );
937 };
@@ -951,7 +951,7 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
951 const Component = () => {
952 const listener = usePress({onPress});
953 return (
954 - <a href="#" listeners={listener}>
954 + <a href="#" DEPRECATED_flareListeners={listener}>
955 <div ref={ref} />
956 </a>
957 );
@@ -974,7 +974,7 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
974
975 const Component = () => {
976 const listener = usePress({onPress});
977 - return <a href="#" ref={ref} listeners={listener} />;
977 + return <a href="#" ref={ref} DEPRECATED_flareListeners={listener} />;
978 };
979 ReactDOM.render(<Component />, container);
980
@@ -996,7 +996,7 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
996
997 const Component = () => {
998 const listener = usePress({onPress, preventDefault: false});
999 - return <a href="#" ref={ref} listeners={listener} />;
999 + return <a href="#" ref={ref} DEPRECATED_flareListeners={listener} />;
1000 };
1001 ReactDOM.render(<Component />, container);
1002
@@ -1016,7 +1016,7 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
1016
1017 const Component = () => {
1018 const listener = usePress({onPress, preventDefault: false});
1019 - return <a href="#" ref={ref} listeners={listener} />;
1019 + return <a href="#" ref={ref} DEPRECATED_flareListeners={listener} />;
1020 };
1021 ReactDOM.render(<Component />, container);
1022
@@ -1038,7 +1038,7 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
1038
1039 const Component = () => {
1040 const listener = usePress({onPressEnd});
1041 - return <a href="#" ref={ref} listeners={listener} />;
1041 + return <a href="#" ref={ref} DEPRECATED_flareListeners={listener} />;
1042 };
1043 ReactDOM.render(<Component />, container);
1044
@@ -1055,7 +1055,7 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
1055
1056 const Component = () => {
1057 const listener = usePress({onPressEnd});
1058 - return <a href="#" ref={ref} listeners={listener} />;
1058 + return <a href="#" ref={ref} DEPRECATED_flareListeners={listener} />;
1059 };
1060 ReactDOM.render(<Component />, container);
1061
@@ -1075,7 +1075,7 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
1075 const listener = usePress({onPressEnd});
1076 return (
1077 <div ref={containerRef}>
1078 - <a ref={ref} listeners={listener} />
1078 + <a ref={ref} DEPRECATED_flareListeners={listener} />
1079 </div>
1080 );
1081 };
@@ -1097,7 +1097,7 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
1097 const listener = usePress({onPressEnd});
1098 return (
1099 <div>
1100 - <a ref={ref} listeners={listener} />
1100 + <a ref={ref} DEPRECATED_flareListeners={listener} />
1101 <span ref={outsideRef} />
1102 </div>
1103 );
@@ -1120,7 +1120,7 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
1120
1121 const Component = () => {
1122 const listener = usePress();
1123 - return <button ref={ref} listeners={listener} />;
1123 + return <button ref={ref} DEPRECATED_flareListeners={listener} />;
1124 };
1125 ReactDOM.render(<Component />, container);
1126
@@ -1140,7 +1140,7 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
1140
1141 const Component = () => {
1142 const listener = usePress({onPress, onPressStart, onPressEnd});
1143 - return <button ref={buttonRef} listeners={listener} />;
1143 + return <button ref={buttonRef} DEPRECATED_flareListeners={listener} />;
1144 };
1145 ReactDOM.render(<Component />, container);
1146
packages/react-interactions/events/src/dom/__tests__/Scroll-test.internal.js
+4 -4
@@ -55,7 +55,7 @@ describe.each(table)('Scroll responder', hasPointerEvents => {
55 disabled: true,
56 onScroll,
57 });
58 - return <div ref={ref} listeners={listener} />;
58 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
59 };
60 ReactDOM.render(<Component />, container);
61 });
@@ -77,7 +77,7 @@ describe.each(table)('Scroll responder', hasPointerEvents => {
77 const listener = useScroll({
78 onScroll,
79 });
80 - return <div ref={ref} listeners={listener} />;
80 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
81 };
82 ReactDOM.render(<Component />, container);
83 });
@@ -148,7 +148,7 @@ describe.each(table)('Scroll responder', hasPointerEvents => {
148 const listener = useScroll({
149 onScrollDragStart,
150 });
151 - return <div ref={ref} listeners={listener} />;
151 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
152 };
153 ReactDOM.render(<Component />, container);
154 });
@@ -178,7 +178,7 @@ describe.each(table)('Scroll responder', hasPointerEvents => {
178 const listener = useScroll({
179 onScrollDragEnd,
180 });
181 - return <div ref={ref} listeners={listener} />;
181 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
182 };
183 ReactDOM.render(<Component />, container);
184 });
packages/react-interactions/events/src/dom/__tests__/Tap-test.internal.js
+11 -11
@@ -87,7 +87,7 @@ describeWithPointerEvent('Tap responder', hasPointerEvents => {
87 const ref = React.createRef();
88 const Component = () => {
89 const listener = useTap();
90 - return <button ref={ref} listeners={listener} />;
90 + return <button ref={ref} DEPRECATED_flareListeners={listener} />;
91 };
92 ReactDOM.render(<Component />, container);
93
@@ -122,7 +122,7 @@ describeWithPointerEvent('Tap responder', hasPointerEvents => {
122 onTapCancel,
123 onTapEnd,
124 });
125 - return <div ref={ref} listeners={listener} />;
125 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
126 };
127 ReactDOM.render(<Component />, container);
128 });
@@ -145,7 +145,7 @@ describeWithPointerEvent('Tap responder', hasPointerEvents => {
145 function render(props) {
146 const Component = () => {
147 const listener = useTap(props);
148 - return <div ref={ref} listeners={listener} />;
148 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
149 };
150 ReactDOM.render(<Component />, container);
151 document.elementFromPoint = () => ref.current;
@@ -201,7 +201,7 @@ describeWithPointerEvent('Tap responder', hasPointerEvents => {
201 ref = React.createRef();
202 const Component = () => {
203 const listener = useTap({onAuxiliaryTap});
204 - return <div ref={ref} listeners={listener} />;
204 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
205 };
206 ReactDOM.render(<Component />, container);
207 document.elementFromPoint = () => ref.current;
@@ -234,7 +234,7 @@ describeWithPointerEvent('Tap responder', hasPointerEvents => {
234 ref = React.createRef();
235 const Component = () => {
236 const listener = useTap({onTapStart});
237 - return <div ref={ref} listeners={listener} />;
237 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
238 };
239 ReactDOM.render(<Component />, container);
240 document.elementFromPoint = () => ref.current;
@@ -338,7 +338,7 @@ describeWithPointerEvent('Tap responder', hasPointerEvents => {
338 ref = React.createRef();
339 const Component = () => {
340 const listener = useTap({onTapEnd});
341 - return <div ref={ref} listeners={listener} />;
341 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
342 };
343 ReactDOM.render(<Component />, container);
344 document.elementFromPoint = () => ref.current;
@@ -391,7 +391,7 @@ describeWithPointerEvent('Tap responder', hasPointerEvents => {
391 const Component = () => {
392 const listener = useTap({onTapEnd});
393 return (
394 - <div ref={targetRef} listeners={listener}>
394 + <div ref={targetRef} DEPRECATED_flareListeners={listener}>
395 <button ref={innerRef} />
396 </div>
397 );
@@ -480,7 +480,7 @@ describeWithPointerEvent('Tap responder', hasPointerEvents => {
480 ref = React.createRef();
481 const Component = () => {
482 const listener = useTap({onTapUpdate});
483 - return <div ref={ref} listeners={listener} />;
483 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
484 };
485 ReactDOM.render(<Component />, container);
486 document.elementFromPoint = () => ref.current;
@@ -592,7 +592,7 @@ describeWithPointerEvent('Tap responder', hasPointerEvents => {
592 onTapEnd: logger('end'),
593 onTapCancel: logger('cancel'),
594 });
595 - return <div ref={ref} listeners={listener} />;
595 + return <div ref={ref} DEPRECATED_flareListeners={listener} />;
596 };
597 ReactDOM.render(<Component />, container);
598 document.elementFromPoint = () => ref.current;
@@ -646,7 +646,7 @@ describeWithPointerEvent('Tap responder', hasPointerEvents => {
646 const listener = useTap({onTapCancel, onTapUpdate});
647 return (
648 <div ref={parentRef}>
649 - <div ref={ref} listeners={listener} />
649 + <div ref={ref} DEPRECATED_flareListeners={listener} />
650 <span ref={siblingRef} />
651 </div>
652 );
@@ -800,7 +800,7 @@ describeWithPointerEvent('Tap responder', hasPointerEvents => {
800 preventDefault: shouldPreventDefault,
801 });
802 return (
803 - <a href="#" ref={ref} listeners={listener}>
803 + <a href="#" ref={ref} DEPRECATED_flareListeners={listener}>
804 <div ref={innerRef} />
805 </a>
806 );
packages/react-reconciler/src/ReactFiberCommitWork.js
+7 -7
@@ -124,7 +124,7 @@ import {
124 } from './ReactHookEffectTags';
125 import {didWarnAboutReassigningProps} from './ReactFiberBeginWork';
126 import {runWithPriority, NormalPriority} from './SchedulerWithReactIntegration';
127 -import {updateEventListeners} from './ReactFiberEvents';
127 +import {updateLegacyEventListeners} from './ReactFiberEvents';
128
129 let didWarnAboutUndefinedSnapshotBeforeUpdate: Set<mixed> | null = null;
130 if (__DEV__) {
@@ -1361,10 +1361,10 @@ function commitWork(current: Fiber | null, finishedWork: Fiber): void {
1361 );
1362 }
1363 if (enableFlareAPI) {
1364 - const prevListeners = oldProps.listeners;
1365 - const nextListeners = newProps.listeners;
1364 + const prevListeners = oldProps.DEPRECATED_flareListeners;
1365 + const nextListeners = newProps.DEPRECATED_flareListeners;
1366 if (prevListeners !== nextListeners) {
1367 - updateEventListeners(nextListeners, finishedWork, null);
1367 + updateLegacyEventListeners(nextListeners, finishedWork, null);
1368 }
1369 }
1370 }
@@ -1426,10 +1426,10 @@ function commitWork(current: Fiber | null, finishedWork: Fiber): void {
1426 if (enableFlareAPI) {
1427 const newProps = finishedWork.memoizedProps;
1428 const oldProps = current !== null ? current.memoizedProps : newProps;
1429 - const prevListeners = oldProps.listeners;
1430 - const nextListeners = newProps.listeners;
1429 + const prevListeners = oldProps.DEPRECATED_flareListeners;
1430 + const nextListeners = newProps.DEPRECATED_flareListeners;
1431 if (prevListeners !== nextListeners) {
1432 - updateEventListeners(nextListeners, finishedWork, null);
1432 + updateLegacyEventListeners(nextListeners, finishedWork, null);
1433 }
1434 }
1435 }
packages/react-reconciler/src/ReactFiberCompleteWork.js
+12 -11
@@ -128,7 +128,7 @@ import {
128 import {createFundamentalStateInstance} from './ReactFiberFundamental';
129 import {Never} from './ReactFiberExpirationTime';
130 import {resetChildFibers} from './ReactChildFiber';
131 -import {updateEventListeners} from './ReactFiberEvents';
131 +import {updateLegacyEventListeners} from './ReactFiberEvents';
132 import {createScopeMethods} from './ReactFiberScope';
133
134 function markUpdate(workInProgress: Fiber) {
@@ -686,8 +686,8 @@ function completeWork(
686 );
687
688 if (enableFlareAPI) {
689 - const prevListeners = current.memoizedProps.listeners;
690 - const nextListeners = newProps.listeners;
689 + const prevListeners = current.memoizedProps.DEPRECATED_flareListeners;
690 + const nextListeners = newProps.DEPRECATED_flareListeners;
691 if (prevListeners !== nextListeners) {
692 markUpdate(workInProgress);
693 }
@@ -728,9 +728,9 @@ function completeWork(
728 markUpdate(workInProgress);
729 }
730 if (enableFlareAPI) {
731 - const listeners = newProps.listeners;
731 + const listeners = newProps.DEPRECATED_flareListeners;
732 if (listeners != null) {
733 - updateEventListeners(
733 + updateLegacyEventListeners(
734 listeners,
735 workInProgress,
736 rootContainerInstance,
@@ -752,9 +752,9 @@ function completeWork(
752 workInProgress.stateNode = instance;
753
754 if (enableFlareAPI) {
755 - const listeners = newProps.listeners;
755 + const listeners = newProps.DEPRECATED_flareListeners;
756 if (listeners != null) {
757 - updateEventListeners(
757 + updateLegacyEventListeners(
758 listeners,
759 workInProgress,
760 rootContainerInstance,
@@ -1252,10 +1252,10 @@ function completeWork(
1252 workInProgress.stateNode = scopeInstance;
1253 scopeInstance.methods = createScopeMethods(type, scopeInstance);
1254 if (enableFlareAPI) {
1255 - const listeners = newProps.listeners;
1255 + const listeners = newProps.DEPRECATED_flareListeners;
1256 if (listeners != null) {
1257 const rootContainerInstance = getRootHostContainer();
1258 - updateEventListeners(
1258 + updateLegacyEventListeners(
1259 listeners,
1260 workInProgress,
1261 rootContainerInstance,
@@ -1268,8 +1268,9 @@ function completeWork(
1268 }
1269 } else {
1270 if (enableFlareAPI) {
1271 - const prevListeners = current.memoizedProps.listeners;
1272 - const nextListeners = newProps.listeners;
1271 + const prevListeners =
1272 + current.memoizedProps.DEPRECATED_flareListeners;
1273 + const nextListeners = newProps.DEPRECATED_flareListeners;
1274 if (
1275 prevListeners !== nextListeners ||
1276 workInProgress.ref !== null
packages/react-reconciler/src/ReactFiberEvents.js
+1 -1
@@ -146,7 +146,7 @@ function updateEventListener(
146 }
147 }
148
149 -export function updateEventListeners(
149 +export function updateLegacyEventListeners(
150 listeners: any,
151 fiber: Fiber,
152 rootContainerInstance: null | Container,
packages/react-reconciler/src/__tests__/ReactScope-test.internal.js
+2 -2
@@ -343,7 +343,7 @@ describe('ReactScope', () => {
343 onKeyDown,
344 });
345 return (
346 - <TestScope listeners={listener}>
346 + <TestScope DEPRECATED_flareListeners={listener}>
347 <div ref={ref} />
348 </TestScope>
349 );
@@ -361,7 +361,7 @@ describe('ReactScope', () => {
361 });
362 return (
363 <div>
364 - <TestScope listeners={listener}>
364 + <TestScope DEPRECATED_flareListeners={listener}>
365 <div ref={ref} />
366 </TestScope>
367 </div>
packages/react-test-renderer/src/ReactTestHostConfig.js
+3 -3
@@ -149,11 +149,11 @@ export function createInstance(
149 ): Instance {
150 let propsToUse = props;
151 if (enableFlareAPI) {
152 - if (props.listeners != null) {
153 - // We want to remove the "listeners" prop
152 + if (props.DEPRECATED_flareListeners != null) {
153 + // We want to remove the "DEPRECATED_flareListeners" prop
154 // as we don't want it in the test renderer's
155 // instance props.
156 - const {listeners, ...otherProps} = props; // eslint-disable-line
156 + const {DEPRECATED_flareListeners, ...otherProps} = props; // eslint-disable-line
157 propsToUse = otherProps;
158 }
159 }