fix(xychart): strip legacy react events from exhaustive prop lists in type declarations

packages/visx-xychart/src/components/series/private/BaseAreaSeries.tsx

@@ -3,7 +3,7 @@ import { AxisScale } from '@visx/axis';
 import Area, { AreaProps } from '@visx/shape/lib/shapes/Area';
 import LinePath, { LinePathProps } from '@visx/shape/lib/shapes/LinePath';
 import DataContext from '../../../context/DataContext';
-import { GlyphsProps, SeriesProps } from '../../../types';
+import { GlyphsProps, SeriesProps, LegacyReactEvents } from '../../../types';
 import withRegisteredData, { WithRegisteredDataProps } from '../../../enhancers/withRegisteredData';
 import getScaledValueFactory from '../../../utils/getScaledValueFactory';
 import getScaleBaseline from '../../../utils/getScaleBaseline';
@@ -29,11 +29,16 @@ export type BaseAreaSeriesProps<
   /** Props to be passed to the Line, if rendered. */
   lineProps?: Omit<
     LinePathProps<Datum> & React.SVGProps<SVGPathElement>,
-    'data' | 'x' | 'y' | 'children' | 'defined'
+    'data' | 'x' | 'y' | 'children' | 'defined' | LegacyReactEvents
   >;
   /** Rendered component which is passed path props by BaseAreaSeries after processing. */
-  PathComponent?: React.FC<Omit<React.SVGProps<SVGPathElement>, 'ref'>> | 'path';
-} & Omit<React.SVGProps<SVGPathElement>, 'x' | 'y' | 'x0' | 'x1' | 'y0' | 'y1' | 'ref'>;
+  PathComponent?:
+    | React.FC<Omit<React.SVGProps<SVGPathElement>, 'ref' | LegacyReactEvents>>
+    | 'path';
+} & Omit<
+    React.SVGProps<SVGPathElement>,
+    'x' | 'y' | 'x0' | 'x1' | 'y0' | 'y1' | 'ref' | LegacyReactEvents
+  >;
 
 function BaseAreaSeries<XScale extends AxisScale, YScale extends AxisScale, Datum extends object>({
   PathComponent = 'path',

packages/visx-xychart/src/components/series/private/BaseLineSeries.tsx

@@ -2,7 +2,7 @@ import React, { useContext, useCallback, useMemo } from 'react';
 import LinePath, { LinePathProps } from '@visx/shape/lib/shapes/LinePath';
 import { AxisScale } from '@visx/axis';
 import DataContext from '../../../context/DataContext';
-import { GlyphsProps, SeriesProps } from '../../../types';
+import { GlyphsProps, LegacyReactEvents, SeriesProps } from '../../../types';
 import withRegisteredData, { WithRegisteredDataProps } from '../../../enhancers/withRegisteredData';
 import getScaledValueFactory from '../../../utils/getScaledValueFactory';
 import isValidNumber from '../../../typeguards/isValidNumber';
@@ -17,12 +17,17 @@ export type BaseLineSeriesProps<
   Datum extends object,
 > = SeriesProps<XScale, YScale, Datum> & {
   /** Rendered component which is passed path props by BaseLineSeries after processing. */
-  PathComponent?: React.FC<Omit<React.SVGProps<SVGPathElement>, 'ref'>> | 'path';
+  PathComponent?:
+    | React.FC<Omit<React.SVGProps<SVGPathElement>, 'ref' | LegacyReactEvents>>
+    | 'path';
   /** Sets the curve factory (from @visx/curve or d3-curve) for the line generator. Defaults to curveLinear. */
   curve?: LinePathProps<Datum>['curve'];
   /** Given a datakey, returns its color. Falls back to theme color if unspecified or if a null-ish value is returned. */
   colorAccessor?: (dataKey: string) => string | undefined | null;
-} & Omit<React.SVGProps<SVGPathElement>, 'x' | 'y' | 'x0' | 'x1' | 'y0' | 'y1' | 'ref'>;
+} & Omit<
+    React.SVGProps<SVGPathElement>,
+    'x' | 'y' | 'x0' | 'x1' | 'y0' | 'y1' | 'ref' | LegacyReactEvents
+  >;
 
 function BaseLineSeries<XScale extends AxisScale, YScale extends AxisScale, Datum extends object>({
   colorAccessor,

packages/visx-xychart/src/types/index.ts

@@ -4,3 +4,4 @@ export * from './event';
 export * from './series';
 export * from './theme';
 export * from './tooltip';
+export * from './util';

packages/visx-xychart/src/types/util.ts

@@ -0,0 +1,12 @@
+/**
+ * The typings for React 16 and 17 erroneously include events named
+ * `onPointerEnterCapture` and `onPointerLeaveCapture`. When type declarations
+ * are generated for this library, these events are included in
+ * exhaustive lists of properties through inlining of the `Omit` utility as an
+ * invested `Pick`. This causes type errors in React 18, where these event names
+ * are not valid.
+ *
+ * To work around this, wrap any such type in this helper, which will strip off
+ * the invalid event names.
+ */
+export type LegacyReactEvents = 'onPointerEnterCapture' | 'onPointerLeaveCapture';