diff --git a/packages/vx-shape/src/factories/arcPath.ts b/packages/vx-shape/src/factories/arcPath.ts
deleted file mode 100644
index 8b85a9d4e0..0000000000
--- a/packages/vx-shape/src/factories/arcPath.ts
+++ /dev/null
@@ -1,41 +0,0 @@
-import { arc as d3Arc } from 'd3-shape';
-import { Accessor } from '../types/accessor';
-import setNumberOrNumberAccessor from '../util/setNumberOrNumberAccessor';
-
-export type ArcPathConfig<Datum> = {
-  /** Number or accessor function which returns a number, which defines the arc innerRadius. */
-  innerRadius?: number | Accessor<Datum, number>;
-  /** Number or accessor function which returns a number, which defines the arc outerRadius. */
-  outerRadius?: number | Accessor<Datum, number>;
-  /** Number or accessor function which returns a number, which defines the arc cornerRadius. */
-  cornerRadius?: number | Accessor<Datum, number>;
-  /** Number or accessor function which returns a number, which defines the arc startAngle. */
-  startAngle?: number | Accessor<Datum, number>;
-  /** Number or accessor function which returns a number, which defines the arc endAngle. */
-  endAngle?: number | Accessor<Datum, number>;
-  /** Number or accessor function which returns a number, which defines the arc padAngle. */
-  padAngle?: number | Accessor<Datum, number>;
-  /** Number or accessor function which returns a number, which defines the arc padRadius. */
-  padRadius?: number | Accessor<Datum, number>;
-};
-
-export default function arcPath<Datum>({
-  innerRadius,
-  outerRadius,
-  cornerRadius,
-  startAngle,
-  endAngle,
-  padAngle,
-  padRadius,
-}: ArcPathConfig<Datum> = {}) {
-  const path = d3Arc<Datum>();
-  if (innerRadius != null) setNumberOrNumberAccessor(path.innerRadius, innerRadius);
-  if (outerRadius != null) setNumberOrNumberAccessor(path.outerRadius, outerRadius);
-  if (cornerRadius != null) setNumberOrNumberAccessor(path.cornerRadius, cornerRadius);
-  if (startAngle != null) setNumberOrNumberAccessor(path.startAngle, startAngle);
-  if (endAngle != null) setNumberOrNumberAccessor(path.endAngle, endAngle);
-  if (padAngle != null) setNumberOrNumberAccessor(path.padAngle, padAngle);
-  if (padRadius != null) setNumberOrNumberAccessor(path.padRadius, padRadius);
-
-  return path;
-}
diff --git a/packages/vx-shape/src/factories/areaPath.ts b/packages/vx-shape/src/factories/areaPath.ts
deleted file mode 100644
index 32db23491c..0000000000
--- a/packages/vx-shape/src/factories/areaPath.ts
+++ /dev/null
@@ -1,45 +0,0 @@
-import { area as d3Area, CurveFactory } from 'd3-shape';
-import { AccessorForArrayItem } from '../types/accessor';
-import setNumberOrNumberAccessor from '../util/setNumberOrNumberAccessor';
-
-export type AreaPathConfig<Datum> = {
-  /** The defined accessor for the shape. The final area shape includes all points for which this function returns true. By default all points are defined. */
-  defined?: AccessorForArrayItem<Datum, boolean>;
-  /** Sets the curve factory (from @vx/curve or d3-curve) for the area generator. Defaults to curveLinear. */
-  curve?: CurveFactory;
-  /** Sets the x0 accessor function, and sets x1 to null. */
-  x?: number | AccessorForArrayItem<Datum, number>;
-  /** Specifies the x0 accessor function which defaults to d => d[0]. */
-  x0?: number | AccessorForArrayItem<Datum, number>;
-  /** Specifies the x1 accessor function which defaults to null. */
-  x1?: number | AccessorForArrayItem<Datum, number>;
-  /** Sets the y0 accessor function, and sets y1 to null. */
-  y?: number | AccessorForArrayItem<Datum, number>;
-  /** Specifies the y0 accessor function which defaults to d => 0. */
-  y0?: number | AccessorForArrayItem<Datum, number>;
-  /** Specifies the y1 accessor function which defaults to d => d[1]. */
-  y1?: number | AccessorForArrayItem<Datum, number>;
-};
-
-export default function areaPath<Datum>({
-  x,
-  x0,
-  x1,
-  y,
-  y0,
-  y1,
-  defined,
-  curve,
-}: AreaPathConfig<Datum> = {}) {
-  const path = d3Area<Datum>();
-  if (x) setNumberOrNumberAccessor(path.x, x);
-  if (x0) setNumberOrNumberAccessor(path.x0, x0);
-  if (x1) setNumberOrNumberAccessor(path.x1, x1);
-  if (y) setNumberOrNumberAccessor(path.y, y);
-  if (y0) setNumberOrNumberAccessor(path.y0, y0);
-  if (y1) setNumberOrNumberAccessor(path.y1, y1);
-  if (defined) path.defined(defined);
-  if (curve) path.curve(curve);
-
-  return path;
-}
diff --git a/packages/vx-shape/src/factories/linePath.ts b/packages/vx-shape/src/factories/linePath.ts
deleted file mode 100644
index 9999dec088..0000000000
--- a/packages/vx-shape/src/factories/linePath.ts
+++ /dev/null
@@ -1,24 +0,0 @@
-import { line as d3Line, CurveFactory, CurveFactoryLineOnly } from 'd3-shape';
-import { AccessorForArrayItem } from '../types/accessor';
-import setNumberOrNumberAccessor from '../util/setNumberOrNumberAccessor';
-
-export type LinePathConfig<Datum> = {
-  /** The defined accessor for the shape. The final line shape includes all points for which this function returns true. By default all points are defined. */
-  defined?: AccessorForArrayItem<Datum, boolean>;
-  /** Sets the curve factory (from @vx/curve or d3-curve) for the line generator. Defaults to curveLinear. */
-  curve?: CurveFactory | CurveFactoryLineOnly;
-  /** Sets the x0 accessor function, and sets x1 to null. */
-  x?: number | AccessorForArrayItem<Datum, number>;
-  /** Sets the y0 accessor function, and sets y1 to null. */
-  y?: number | AccessorForArrayItem<Datum, number>;
-};
-
-export default function linePath<Datum>({ x, y, defined, curve }: LinePathConfig<Datum> = {}) {
-  const path = d3Line<Datum>();
-  if (x) setNumberOrNumberAccessor(path.x, x);
-  if (y) setNumberOrNumberAccessor(path.y, y);
-  if (defined) path.defined(defined);
-  if (curve) path.curve(curve);
-
-  return path;
-}
diff --git a/packages/vx-shape/src/factories/piePath.ts b/packages/vx-shape/src/factories/piePath.ts
deleted file mode 100644
index 6f4d7052de..0000000000
--- a/packages/vx-shape/src/factories/piePath.ts
+++ /dev/null
@@ -1,46 +0,0 @@
-import { pie as d3Pie } from 'd3-shape';
-import { Accessor } from '../types/accessor';
-import setNumberOrNumberAccessor from '../util/setNumberOrNumberAccessor';
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-type AngleAccessor<Datum> = (this: any, data: Datum[], ...args: any[]) => number;
-
-export type PiePathConfig<Datum> = {
-  /** Returns the start angle of the overall Pie shape (the first value starts at startAngle), with 0 at -y (12 o’clock) and positive angles proceeding clockwise. */
-  startAngle?: number | AngleAccessor<Datum>;
-  /** Returns the end angle of the overall Pie shape (the last value ends at endAngle), with 0 at -y (12 o’clock) and positive angles proceeding clockwise. */
-  endAngle?: number | AngleAccessor<Datum>;
-  /** Padding angle of the Pie shape, which sets a fixed linear distance separating adjacent arcs. */
-  padAngle?: number | AngleAccessor<Datum>;
-  /** Invoked for each datum, returns the value for a given Pie segment/arc datum. */
-  value?: Accessor<Datum, number>;
-  /** Comparator function to sort *arcs*, overridden by sortValues if defined. If sort and sortValues are null, arcs match input data order. */
-  sort?: null | ((a: Datum, b: Datum) => number);
-  /** Comparator function to sort arc *values*, overrides sort if defined. If sort and sortValues are null, arcs match input data order. */
-  sortValues?: null | ((a: number, b: number) => number);
-};
-
-export default function piePath<Datum>({
-  startAngle,
-  endAngle,
-  padAngle,
-  value,
-  sort,
-  sortValues,
-}: PiePathConfig<Datum> = {}) {
-  const path = d3Pie<Datum>();
-
-  // ts can't distinguish between these method overloads
-  if (sort === null) path.sort(sort);
-  else if (sort != null) path.sort(sort);
-  if (sortValues === null) path.sortValues(sortValues);
-  else if (sortValues != null) path.sortValues(sortValues);
-
-  if (value != null) path.value(value);
-
-  if (padAngle != null) setNumberOrNumberAccessor(path.padAngle, padAngle);
-  if (startAngle != null) setNumberOrNumberAccessor(path.startAngle, startAngle);
-  if (endAngle != null) setNumberOrNumberAccessor(path.endAngle, endAngle);
-
-  return path;
-}
diff --git a/packages/vx-shape/src/factories/radialLinePath.ts b/packages/vx-shape/src/factories/radialLinePath.ts
deleted file mode 100644
index 29d72cb966..0000000000
--- a/packages/vx-shape/src/factories/radialLinePath.ts
+++ /dev/null
@@ -1,29 +0,0 @@
-import { radialLine as d3RadialLine, CurveFactory, CurveFactoryLineOnly } from 'd3-shape';
-import { AccessorForArrayItem } from '../types/accessor';
-import setNumberOrNumberAccessor from '../util/setNumberOrNumberAccessor';
-
-export type RadialLinePathConfig<Datum> = {
-  /** The defined accessor for the shape. The final radialLine shape includes all points for which this function returns true. By default all points are defined. */
-  defined?: AccessorForArrayItem<Datum, boolean>;
-  /** Sets the curve factory (from @vx/curve or d3-curve) for the radialLine generator. Defaults to curveLinear. */
-  curve?: CurveFactory | CurveFactoryLineOnly;
-  /** Returns the angle value in radians for a given Datum, with 0 at -y (12 o’clock). */
-  angle?: number | AccessorForArrayItem<Datum, number>;
-  /** Returns the radius value in radians for a given Datum, with 0 at the center. */
-  radius?: number | AccessorForArrayItem<Datum, number>;
-};
-
-export default function radialLinePath<Datum>({
-  angle,
-  radius,
-  defined,
-  curve,
-}: RadialLinePathConfig<Datum> = {}) {
-  const path = d3RadialLine<Datum>();
-  if (angle) setNumberOrNumberAccessor(path.angle, angle);
-  if (radius) setNumberOrNumberAccessor(path.radius, radius);
-  if (defined) path.defined(defined);
-  if (curve) path.curve(curve);
-
-  return path;
-}
diff --git a/packages/vx-shape/src/index.ts b/packages/vx-shape/src/index.ts
index 54ce2ee069..2f3f095e4b 100644
--- a/packages/vx-shape/src/index.ts
+++ b/packages/vx-shape/src/index.ts
@@ -45,3 +45,7 @@ export { default as LinkVerticalStep, pathVerticalStep } from './shapes/link/ste
 export { default as LinkRadialStep, pathRadialStep } from './shapes/link/step/LinkRadialStep';
 export { default as Polygon, getPoints, getPoint } from './shapes/Polygon';
 export { default as Circle } from './shapes/Circle';
+
+// Export factory functions
+export * from './types/D3ShapeConfig';
+export * from './util/D3ShapeFactories';
diff --git a/packages/vx-shape/src/shapes/Arc.tsx b/packages/vx-shape/src/shapes/Arc.tsx
index 182792a98c..b310b96af8 100644
--- a/packages/vx-shape/src/shapes/Arc.tsx
+++ b/packages/vx-shape/src/shapes/Arc.tsx
@@ -1,8 +1,8 @@
 import React from 'react';
 import cx from 'classnames';
 import { Arc as ArcType } from 'd3-shape';
-import { $TSFIXME, AddSVGProps } from '../types';
-import arc, { ArcPathConfig } from '../factories/arcPath';
+import { $TSFIXME, AddSVGProps, ArcPathConfig } from '../types';
+import { arc } from '../util/D3ShapeFactories';
 
 export type ArcProps<Datum> = {
   /** className applied to path element. */
diff --git a/packages/vx-shape/src/shapes/Area.tsx b/packages/vx-shape/src/shapes/Area.tsx
index 332337b1de..4d98d9ff86 100644
--- a/packages/vx-shape/src/shapes/Area.tsx
+++ b/packages/vx-shape/src/shapes/Area.tsx
@@ -1,8 +1,7 @@
 import React from 'react';
 import cx from 'classnames';
-import { AddSVGProps } from '../types';
-import { BaseAreaProps } from '../types/area';
-import areaPath from '../factories/areaPath';
+import { AddSVGProps, BaseAreaProps } from '../types';
+import { area } from '../util/D3ShapeFactories';
 
 export type AreaProps<Datum> = BaseAreaProps<Datum>;
 
@@ -21,7 +20,7 @@ export default function Area<Datum>({
   innerRef,
   ...restProps
 }: AddSVGProps<AreaProps<Datum>, SVGPathElement>) {
-  const path = areaPath<Datum>({ x, x0, x1, y, y0, y1, defined, curve });
+  const path = area<Datum>({ x, x0, x1, y, y0, y1, defined, curve });
   // eslint-disable-next-line react/jsx-no-useless-fragment
   if (children) return <>{children({ path })}</>;
   return (
diff --git a/packages/vx-shape/src/shapes/AreaClosed.tsx b/packages/vx-shape/src/shapes/AreaClosed.tsx
index bf9cfd091e..c19343c126 100644
--- a/packages/vx-shape/src/shapes/AreaClosed.tsx
+++ b/packages/vx-shape/src/shapes/AreaClosed.tsx
@@ -1,9 +1,8 @@
 import React from 'react';
 import cx from 'classnames';
+import { PositionScale, AddSVGProps, BaseAreaProps } from '../types';
 import setNumOrAccessor from '../util/setNumberOrNumberAccessor';
-import { PositionScale, AddSVGProps } from '../types';
-import { BaseAreaProps } from '../types/area';
-import area from '../factories/areaPath';
+import { area } from '../util/D3ShapeFactories';
 
 export type AreaClosedProps<Datum> = BaseAreaProps<Datum> & {
   yScale: PositionScale;
diff --git a/packages/vx-shape/src/shapes/AreaStack.tsx b/packages/vx-shape/src/shapes/AreaStack.tsx
index a4702bf4fe..96f53333cb 100644
--- a/packages/vx-shape/src/shapes/AreaStack.tsx
+++ b/packages/vx-shape/src/shapes/AreaStack.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import cx from 'classnames';
 import Stack, { StackProps } from './Stack';
-import { StackKey, AddSVGProps } from '../types';
+import { AddSVGProps, StackKey } from '../types';
 
 type PickProps =
   | 'className'
diff --git a/packages/vx-shape/src/shapes/BarGroup.tsx b/packages/vx-shape/src/shapes/BarGroup.tsx
index 45ffe6ffb9..c64a144f4e 100644
--- a/packages/vx-shape/src/shapes/BarGroup.tsx
+++ b/packages/vx-shape/src/shapes/BarGroup.tsx
@@ -3,14 +3,21 @@ import cx from 'classnames';
 import { Group } from '@vx/group';
 import { ScaleInput } from '@vx/scale';
 import Bar from './Bar';
-import { PositionScale, DatumObject, AnyScaleBand, AddSVGProps } from '../types';
-import { BaseBarGroupProps, BarGroup } from '../types/bar';
-import { Accessor } from '../types/accessor';
+import {
+  PositionScale,
+  DatumObject,
+  AnyScaleBand,
+  AddSVGProps,
+  BaseBarGroupProps,
+  BarGroup,
+  GroupKey,
+  Accessor,
+} from '../types';
 import getBandwidth from '../util/getBandwidth';
 
 export type BarGroupProps<
   Datum extends DatumObject,
-  Key extends keyof Datum = keyof Datum,
+  Key extends GroupKey = GroupKey,
   X0Scale extends AnyScaleBand = AnyScaleBand,
   X1Scale extends AnyScaleBand = AnyScaleBand
 > = BaseBarGroupProps<Datum, Key> & {
@@ -68,7 +75,7 @@ export type BarGroupProps<
  */
 export default function BarGroupComponent<
   Datum extends DatumObject,
-  Key extends keyof Datum = keyof Datum,
+  Key extends GroupKey = GroupKey,
   X0Scale extends AnyScaleBand = AnyScaleBand,
   X1Scale extends AnyScaleBand = AnyScaleBand
 >({
diff --git a/packages/vx-shape/src/shapes/BarGroupHorizontal.tsx b/packages/vx-shape/src/shapes/BarGroupHorizontal.tsx
index 3297617aa7..85f85700ed 100644
--- a/packages/vx-shape/src/shapes/BarGroupHorizontal.tsx
+++ b/packages/vx-shape/src/shapes/BarGroupHorizontal.tsx
@@ -3,14 +3,21 @@ import cx from 'classnames';
 import { Group } from '@vx/group';
 import { ScaleInput } from '@vx/scale';
 import Bar from './Bar';
-import { PositionScale, AnyScaleBand, DatumObject, AddSVGProps } from '../types';
-import { BarGroupHorizontal, BaseBarGroupProps } from '../types/bar';
-import { Accessor } from '../types/accessor';
+import {
+  PositionScale,
+  AnyScaleBand,
+  DatumObject,
+  AddSVGProps,
+  BarGroupHorizontal,
+  BaseBarGroupProps,
+  GroupKey,
+  Accessor,
+} from '../types';
 import getBandwidth from '../util/getBandwidth';
 
 export type BarGroupHorizontalProps<
   Datum extends DatumObject,
-  Key extends keyof Datum = keyof Datum,
+  Key extends GroupKey = GroupKey,
   Y0Scale extends AnyScaleBand = AnyScaleBand,
   Y1Scale extends AnyScaleBand = AnyScaleBand
 > = BaseBarGroupProps<Datum, Key> & {
@@ -32,7 +39,7 @@ export type BarGroupHorizontalProps<
 
 export default function BarGroupHorizontalComponent<
   Datum extends DatumObject,
-  Key extends keyof Datum = keyof Datum,
+  Key extends GroupKey = GroupKey,
   Y0Scale extends AnyScaleBand = AnyScaleBand,
   Y1Scale extends AnyScaleBand = AnyScaleBand
 >({
diff --git a/packages/vx-shape/src/shapes/BarStack.tsx b/packages/vx-shape/src/shapes/BarStack.tsx
index 606a73fd7f..07707b1d51 100644
--- a/packages/vx-shape/src/shapes/BarStack.tsx
+++ b/packages/vx-shape/src/shapes/BarStack.tsx
@@ -1,33 +1,28 @@
 import React from 'react';
 import cx from 'classnames';
-import { Group } from '@vx/group';
 import { stack as d3stack, SeriesPoint } from 'd3-shape';
-
+import { Group } from '@vx/group';
 import { ScaleInput } from '@vx/scale';
+import { PositionScale, AddSVGProps, BarStack, BaseBarStackProps, StackKey } from '../types';
+import { getFirstItem, getSecondItem } from '../util/accessors';
+import getBandwidth from '../util/getBandwidth';
+import setNumOrAccessor from '../util/setNumberOrNumberAccessor';
 import stackOrder from '../util/stackOrder';
 import stackOffset from '../util/stackOffset';
 import Bar from './Bar';
-import { StackKey, $TSFIXME, PositionScale, AddSVGProps } from '../types';
-import setNumOrAccessor from '../util/setNumberOrNumberAccessor';
-import { BarStack, BaseBarStackProps } from '../types/stack';
-import getBandwidth from '../util/getBandwidth';
 
 export type BarStackProps<
   Datum,
-  Key,
+  Key extends StackKey = StackKey,
   XScale extends PositionScale = PositionScale,
   YScale extends PositionScale = PositionScale
-> = BaseBarStackProps<Datum, Key> & {
+> = BaseBarStackProps<Datum, Key, XScale, YScale> & {
   /** Returns the value mapped to the x of a bar. */
   x: (d: Datum) => ScaleInput<XScale>;
   /** Returns the value mapped to the y0 of a bar. */
   y0?: (d: SeriesPoint<Datum>) => ScaleInput<YScale>;
   /** Returns the value mapped to the y1 of a bar. */
   y1?: (d: SeriesPoint<Datum>) => ScaleInput<YScale>;
-  /** @vx/scale or d3-scale that takes an x value and maps it to an x axis position. */
-  xScale: XScale;
-  /** @vx/scale or d3-scale that takes a y value and maps it to an y axis position. */
-  yScale: YScale;
 };
 
 export default function BarStackComponent<
@@ -41,8 +36,8 @@ export default function BarStackComponent<
   top,
   left,
   x,
-  y0 = (d: $TSFIXME) => d?.[0],
-  y1 = (d: $TSFIXME) => d?.[1],
+  y0 = getFirstItem,
+  y1 = getSecondItem,
   xScale,
   yScale,
   color,
diff --git a/packages/vx-shape/src/shapes/BarStackHorizontal.tsx b/packages/vx-shape/src/shapes/BarStackHorizontal.tsx
index 209afe64ce..5095964645 100644
--- a/packages/vx-shape/src/shapes/BarStackHorizontal.tsx
+++ b/packages/vx-shape/src/shapes/BarStackHorizontal.tsx
@@ -1,33 +1,28 @@
 import React from 'react';
 import cx from 'classnames';
-import { Group } from '@vx/group';
 import { stack as d3stack, SeriesPoint } from 'd3-shape';
-
+import { Group } from '@vx/group';
 import { ScaleInput } from '@vx/scale';
+import { AddSVGProps, PositionScale, BaseBarStackProps, StackKey } from '../types';
+import { getFirstItem, getSecondItem } from '../util/accessors';
+import getBandwidth from '../util/getBandwidth';
+import setNumOrAccessor from '../util/setNumberOrNumberAccessor';
 import stackOrder from '../util/stackOrder';
 import stackOffset from '../util/stackOffset';
 import Bar from './Bar';
-import { StackKey, $TSFIXME, AddSVGProps, PositionScale } from '../types';
-import setNumOrAccessor from '../util/setNumberOrNumberAccessor';
-import { BaseBarStackProps } from '../types/stack';
-import getBandwidth from '../util/getBandwidth';
 
 export type BarStackHorizontalProps<
   Datum,
-  Key,
+  Key extends StackKey = StackKey,
   XScale extends PositionScale = PositionScale,
   YScale extends PositionScale = PositionScale
-> = BaseBarStackProps<Datum, Key> & {
+> = BaseBarStackProps<Datum, Key, XScale, YScale> & {
   /** Returns the value mapped to the x0 of a bar. */
   x0?: (d: SeriesPoint<Datum>) => ScaleInput<XScale>;
   /** Returns the value mapped to the x1 of a bar. */
   x1?: (d: SeriesPoint<Datum>) => ScaleInput<XScale>;
   /** Returns the value mapped to the y of a bar. */
   y: (d: Datum) => ScaleInput<YScale>;
-  /** @vx/scale or d3-scale that takes an x value and maps it to an x axis position. */
-  xScale: XScale;
-  /** @vx/scale or d3-scale that takes a y value and maps it to an y axis position. */
-  yScale: YScale;
 };
 
 export default function BarStackHorizontal<
@@ -41,8 +36,8 @@ export default function BarStackHorizontal<
   top,
   left,
   y,
-  x0 = (d: $TSFIXME) => d?.[0],
-  x1 = (d: $TSFIXME) => d?.[1],
+  x0 = getFirstItem,
+  x1 = getSecondItem,
   xScale,
   yScale,
   color,
diff --git a/packages/vx-shape/src/shapes/LinePath.tsx b/packages/vx-shape/src/shapes/LinePath.tsx
index 23c88565c9..1567ebb476 100644
--- a/packages/vx-shape/src/shapes/LinePath.tsx
+++ b/packages/vx-shape/src/shapes/LinePath.tsx
@@ -1,8 +1,8 @@
 import React from 'react';
 import cx from 'classnames';
 import { Line as LineType } from 'd3-shape';
-import { AddSVGProps } from '../types';
-import linePath, { LinePathConfig } from '../factories/linePath';
+import { AddSVGProps, LinePathConfig } from '../types';
+import { line } from '../util/D3ShapeFactories';
 
 export type LinePathProps<Datum> = {
   /** Array of data for which to generate a line shape. */
@@ -29,7 +29,7 @@ export default function LinePath<Datum>({
   defined = () => true,
   ...restProps
 }: AddSVGProps<LinePathProps<Datum>, SVGPathElement>) {
-  const path = linePath<Datum>({ x, y, defined, curve });
+  const path = line<Datum>({ x, y, defined, curve });
   // eslint-disable-next-line react/jsx-no-useless-fragment
   if (children) return <>{children({ path })}</>;
   return (
diff --git a/packages/vx-shape/src/shapes/LineRadial.tsx b/packages/vx-shape/src/shapes/LineRadial.tsx
index 415e760786..ad4a6d247f 100644
--- a/packages/vx-shape/src/shapes/LineRadial.tsx
+++ b/packages/vx-shape/src/shapes/LineRadial.tsx
@@ -2,8 +2,8 @@ import React from 'react';
 import cx from 'classnames';
 import { RadialLine } from 'd3-shape';
 import { LinePathProps } from './LinePath';
-import { AddSVGProps } from '../types';
-import radialLinePath, { RadialLinePathConfig } from '../factories/radialLinePath';
+import { AddSVGProps, RadialLinePathConfig } from '../types';
+import { radialLine } from '../util/D3ShapeFactories';
 
 export type LineRadialProps<Datum> = Pick<
   LinePathProps<Datum>,
@@ -25,7 +25,7 @@ export default function LineRadial<Datum>({
   fill = 'transparent',
   ...restProps
 }: AddSVGProps<LineRadialProps<Datum>, SVGPathElement>) {
-  const path = radialLinePath<Datum>({
+  const path = radialLine<Datum>({
     angle,
     radius,
     defined,
diff --git a/packages/vx-shape/src/shapes/Pie.tsx b/packages/vx-shape/src/shapes/Pie.tsx
index 63c0a578e2..56cf28641e 100644
--- a/packages/vx-shape/src/shapes/Pie.tsx
+++ b/packages/vx-shape/src/shapes/Pie.tsx
@@ -2,9 +2,8 @@ import React from 'react';
 import cx from 'classnames';
 import { Group } from '@vx/group';
 import { Arc as ArcType, PieArcDatum as PieArcDatumType, Pie as PieType } from 'd3-shape';
-import { $TSFIXME, AddSVGProps } from '../types';
-import piePath, { PiePathConfig } from '../factories/piePath';
-import arcPath, { ArcPathConfig } from '../factories/arcPath';
+import { $TSFIXME, AddSVGProps, ArcPathConfig, PiePathConfig } from '../types';
+import { arc as arcPath, pie as piePath } from '../util/D3ShapeFactories';
 
 export type PieArcDatum<Datum> = PieArcDatumType<Datum>;
 
diff --git a/packages/vx-shape/src/shapes/Stack.tsx b/packages/vx-shape/src/shapes/Stack.tsx
index 8be005ef00..5de64cf7cc 100644
--- a/packages/vx-shape/src/shapes/Stack.tsx
+++ b/packages/vx-shape/src/shapes/Stack.tsx
@@ -12,10 +12,15 @@ import {
 import setNumOrAccessor from '../util/setNumberOrNumberAccessor';
 import stackOrder from '../util/stackOrder';
 import stackOffset from '../util/stackOffset';
-import { StackKey, $TSFIXME, AddSVGProps } from '../types';
-import { AccessorForArrayItem } from '../types/accessor';
-import { BaseStackProps } from '../types/stack';
-import area, { AreaPathConfig } from '../factories/areaPath';
+import {
+  $TSFIXME,
+  AddSVGProps,
+  AccessorForArrayItem,
+  StackKey,
+  BaseStackProps,
+  AreaPathConfig,
+} from '../types';
+import { area } from '../util/D3ShapeFactories';
 
 export type StackProps<Datum, Key> = BaseStackProps<Datum, Key> & {
   /** Returns a color for a given stack key and index. */
@@ -38,7 +43,7 @@ export type StackProps<Datum, Key> = BaseStackProps<Datum, Key> & {
   y1?: AccessorForArrayItem<SeriesPoint<Datum>, number>;
 } & Pick<AreaPathConfig<SeriesPoint<Datum>>, 'defined' | 'curve'>;
 
-export default function Stack<Datum, Key = StackKey>({
+export default function Stack<Datum, Key extends StackKey = StackKey>({
   className,
   top,
   left,
diff --git a/packages/vx-shape/src/types/D3ShapeConfig.ts b/packages/vx-shape/src/types/D3ShapeConfig.ts
new file mode 100644
index 0000000000..7ed0667382
--- /dev/null
+++ b/packages/vx-shape/src/types/D3ShapeConfig.ts
@@ -0,0 +1,78 @@
+import { CurveFactory, CurveFactoryLineOnly } from 'd3-shape';
+import { Accessor, AccessorForArrayItem } from './accessor';
+
+export type ArcPathConfig<Datum> = {
+  /** Number or accessor function which returns a number, which defines the arc innerRadius. */
+  innerRadius?: number | Accessor<Datum, number>;
+  /** Number or accessor function which returns a number, which defines the arc outerRadius. */
+  outerRadius?: number | Accessor<Datum, number>;
+  /** Number or accessor function which returns a number, which defines the arc cornerRadius. */
+  cornerRadius?: number | Accessor<Datum, number>;
+  /** Number or accessor function which returns a number, which defines the arc startAngle. */
+  startAngle?: number | Accessor<Datum, number>;
+  /** Number or accessor function which returns a number, which defines the arc endAngle. */
+  endAngle?: number | Accessor<Datum, number>;
+  /** Number or accessor function which returns a number, which defines the arc padAngle. */
+  padAngle?: number | Accessor<Datum, number>;
+  /** Number or accessor function which returns a number, which defines the arc padRadius. */
+  padRadius?: number | Accessor<Datum, number>;
+};
+
+export type AreaPathConfig<Datum> = {
+  /** The defined accessor for the shape. The final area shape includes all points for which this function returns true. By default all points are defined. */
+  defined?: AccessorForArrayItem<Datum, boolean>;
+  /** Sets the curve factory (from @vx/curve or d3-curve) for the area generator. Defaults to curveLinear. */
+  curve?: CurveFactory;
+  /** Sets the x0 accessor function, and sets x1 to null. */
+  x?: number | AccessorForArrayItem<Datum, number>;
+  /** Specifies the x0 accessor function which defaults to d => d[0]. */
+  x0?: number | AccessorForArrayItem<Datum, number>;
+  /** Specifies the x1 accessor function which defaults to null. */
+  x1?: number | AccessorForArrayItem<Datum, number>;
+  /** Sets the y0 accessor function, and sets y1 to null. */
+  y?: number | AccessorForArrayItem<Datum, number>;
+  /** Specifies the y0 accessor function which defaults to d => 0. */
+  y0?: number | AccessorForArrayItem<Datum, number>;
+  /** Specifies the y1 accessor function which defaults to d => d[1]. */
+  y1?: number | AccessorForArrayItem<Datum, number>;
+};
+
+export type LinePathConfig<Datum> = {
+  /** The defined accessor for the shape. The final line shape includes all points for which this function returns true. By default all points are defined. */
+  defined?: AccessorForArrayItem<Datum, boolean>;
+  /** Sets the curve factory (from @vx/curve or d3-curve) for the line generator. Defaults to curveLinear. */
+  curve?: CurveFactory | CurveFactoryLineOnly;
+  /** Sets the x0 accessor function, and sets x1 to null. */
+  x?: number | AccessorForArrayItem<Datum, number>;
+  /** Sets the y0 accessor function, and sets y1 to null. */
+  y?: number | AccessorForArrayItem<Datum, number>;
+};
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+type AngleAccessor<Datum> = (this: any, data: Datum[], ...args: any[]) => number;
+
+export type PiePathConfig<Datum> = {
+  /** Returns the start angle of the overall Pie shape (the first value starts at startAngle), with 0 at -y (12 o’clock) and positive angles proceeding clockwise. */
+  startAngle?: number | AngleAccessor<Datum>;
+  /** Returns the end angle of the overall Pie shape (the last value ends at endAngle), with 0 at -y (12 o’clock) and positive angles proceeding clockwise. */
+  endAngle?: number | AngleAccessor<Datum>;
+  /** Padding angle of the Pie shape, which sets a fixed linear distance separating adjacent arcs. */
+  padAngle?: number | AngleAccessor<Datum>;
+  /** Invoked for each datum, returns the value for a given Pie segment/arc datum. */
+  value?: Accessor<Datum, number>;
+  /** Comparator function to sort *arcs*, overridden by sortValues if defined. If sort and sortValues are null, arcs match input data order. */
+  sort?: null | ((a: Datum, b: Datum) => number);
+  /** Comparator function to sort arc *values*, overrides sort if defined. If sort and sortValues are null, arcs match input data order. */
+  sortValues?: null | ((a: number, b: number) => number);
+};
+
+export type RadialLinePathConfig<Datum> = {
+  /** The defined accessor for the shape. The final radialLine shape includes all points for which this function returns true. By default all points are defined. */
+  defined?: AccessorForArrayItem<Datum, boolean>;
+  /** Sets the curve factory (from @vx/curve or d3-curve) for the radialLine generator. Defaults to curveLinear. */
+  curve?: CurveFactory | CurveFactoryLineOnly;
+  /** Returns the angle value in radians for a given Datum, with 0 at -y (12 o’clock). */
+  angle?: number | AccessorForArrayItem<Datum, number>;
+  /** Returns the radius value in radians for a given Datum, with 0 at the center. */
+  radius?: number | AccessorForArrayItem<Datum, number>;
+};
diff --git a/packages/vx-shape/src/types/area.ts b/packages/vx-shape/src/types/area.ts
index 9312306ed0..e15c70d44e 100644
--- a/packages/vx-shape/src/types/area.ts
+++ b/packages/vx-shape/src/types/area.ts
@@ -1,5 +1,5 @@
 import { Area } from 'd3-shape';
-import { AreaPathConfig } from '../factories/areaPath';
+import { AreaPathConfig } from './D3ShapeConfig';
 
 export type BaseAreaProps<Datum> = {
   /** Override render function which is passed the configured area generator as input. */
diff --git a/packages/vx-shape/src/types/barGroup.ts b/packages/vx-shape/src/types/barGroup.ts
new file mode 100644
index 0000000000..0f18b8d858
--- /dev/null
+++ b/packages/vx-shape/src/types/barGroup.ts
@@ -0,0 +1,57 @@
+import { DatumObject } from './base';
+
+/** Unique key for item in a group. */
+export type GroupKey = string | number;
+
+export interface BarGroupBar<Key> {
+  /** group key */
+  key: Key;
+  /** index of BarGroup (matches input Datum index). */
+  index: number;
+  /** group value (Datum[key]) */
+  value: number;
+  /** height of bar. */
+  height: number;
+  /** width of bar. */
+  width: number;
+  /** x position of bar. */
+  x: number;
+  /** y position of bar. */
+  y: number;
+  /** color of bar. */
+  color: string;
+}
+
+interface BaseBarGroup<Key> {
+  /** index of BarGroup (matches input Datum index). */
+  index: number;
+  /** bars within group, one for each key. */
+  bars: BarGroupBar<Key>[];
+}
+
+/** One BarGroup is returned for each datum, which has multiple sub-bars (based on keys). */
+export interface BarGroup<Key> extends BaseBarGroup<Key> {
+  /** x0 position of bar group */
+  x0: number;
+}
+
+/** One BarGroup is returned for each datum, which has multiple sub-bars (based on keys). */
+export interface BarGroupHorizontal<Key> extends BaseBarGroup<Key> {
+  /** y0 position of bar group */
+  y0: number;
+}
+
+export interface BaseBarGroupProps<Datum extends DatumObject, Key extends GroupKey = GroupKey> {
+  /** Array of data for which to generate grouped bars. */
+  data: Datum[];
+  /** Returns the desired color for a bar with a given key and index. */
+  color: (key: Key, index: number) => string;
+  /** Array of keys corresponding to stack layers. */
+  keys: Key[];
+  /** className applied to Bars. */
+  className?: string;
+  /** Top offset of rendered Bars. */
+  top?: number;
+  /** Left offset of rendered Bars. */
+  left?: number;
+}
diff --git a/packages/vx-shape/src/types/barStack.ts b/packages/vx-shape/src/types/barStack.ts
new file mode 100644
index 0000000000..0de215387a
--- /dev/null
+++ b/packages/vx-shape/src/types/barStack.ts
@@ -0,0 +1,32 @@
+import { SeriesPoint } from 'd3-shape';
+import { BarGroupBar } from './barGroup';
+import { BaseStackProps, StackKey } from './stack';
+import { PositionScale } from './base';
+
+/** One BarStack is returned for each datum, which has multiple sub-bars (based on keys). */
+export interface BarStack<Datum, Key> {
+  index: number;
+  key: Key;
+  bars: (Omit<BarGroupBar<Key>, 'key' | 'value'> & {
+    /** Processed bar Datum with bar bounds and original datum. */
+    bar: SeriesPoint<Datum>;
+    /** stack key */
+    key: Key;
+  })[];
+}
+
+export type BaseBarStackProps<
+  Datum,
+  Key extends StackKey = StackKey,
+  XScale extends PositionScale = PositionScale,
+  YScale extends PositionScale = PositionScale
+> = BaseStackProps<Datum, Key> & {
+  /** @vx/scale or d3-scale that takes an x value and maps it to an x axis position. */
+  xScale: XScale;
+  /** @vx/scale or d3-scale that takes a y value and maps it to an y axis position. */
+  yScale: YScale;
+  /** Returns the desired color for a bar with a given key and index. */
+  color: (key: Key, index: number) => string;
+  /** Override render function which is passed the configured arc generator as input. */
+  children?: (stacks: BarStack<Datum, Key>[]) => React.ReactNode;
+};
diff --git a/packages/vx-shape/src/types/base.ts b/packages/vx-shape/src/types/base.ts
new file mode 100644
index 0000000000..815c1b60e9
--- /dev/null
+++ b/packages/vx-shape/src/types/base.ts
@@ -0,0 +1,22 @@
+import { D3Scale, PickD3Scale } from '@vx/scale';
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export type $TSFIXME = any;
+
+export type DatumObject = Record<string | number, $TSFIXME>;
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export type AnyScaleBand = PickD3Scale<'band', any, any>;
+
+/** A catch-all type for scales that returns number */
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export type PositionScale = D3Scale<number, any, any>;
+
+/**
+ * Add fields from `SVGProps` for the specified SVG `Element`
+ * to `Props` except fields that already exist in `Props`
+ */
+export type AddSVGProps<Props, Element extends SVGElement> = Props &
+  Omit<React.SVGProps<Element>, keyof Props>;
+
+export type RenderProp<Input> = (args: Input) => React.ReactNode;
diff --git a/packages/vx-shape/src/types/index.ts b/packages/vx-shape/src/types/index.ts
index e6d9afe877..735e8cf3df 100644
--- a/packages/vx-shape/src/types/index.ts
+++ b/packages/vx-shape/src/types/index.ts
@@ -1,64 +1,9 @@
-import { D3Scale, PickD3Scale } from '@vx/scale';
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export type $TSFIXME = any;
-
-export type DatumObject = Record<string, $TSFIXME>;
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export type AnyScaleBand = PickD3Scale<'band', any, any>;
-
-/** A catch-all type for scales that returns number */
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export type PositionScale = D3Scale<number, any, any>;
-
-/**
- * Add fields from `SVGProps` for the specified SVG `Element`
- * to `Props` except fields that already exist in `Props`
- */
-export type AddSVGProps<Props, Element extends SVGElement> = Props &
-  Omit<React.SVGProps<Element>, keyof Props>;
-
-export type ChildrenProp<Input> = (args: Input) => React.ReactNode;
-
-/** Unique key for item in a stack. */
-export type StackKey = string | number;
-
-/** Unique key for item in a group. */
-export type GroupKey = string | number;
-
-export type AccessorProps<Link, Node> = {
-  /** Given a node, returns its x coordinate. */
-  x?: (node: Node) => number;
-  /** Given a node, returns its y coordinate. */
-  y?: (node: Node) => number;
-  /** Given a link, returns the source node. */
-  source?: (link: Link) => Node;
-  /** Given a link, returns the target node. */
-  target?: (link: Link) => Node;
-};
-
-export type RadialAccessorProps<Link, Node> = Pick<
-  AccessorProps<Link, Node>,
-  'source' | 'target'
-> & {
-  /** Given a node, returns its x coordinate. */
-  angle?: (node: Node) => number;
-  /** Given a node, returns its y coordinate. */
-  radius?: (node: Node) => number;
-};
-
-type PathType<Link> = (link: Link) => string | null;
-
-export type SharedLinkProps<Link> = {
-  /** className applied to path element. */
-  className?: string;
-  /** React ref to the path element. */
-  innerRef?: React.Ref<SVGPathElement>;
-  /** Path generator, given a link returns a path d attribute string */
-  path?: PathType<Link>;
-  /** Render function override which is passed the configured path generator as input. */
-  children?: (args: { path: PathType<Link> }) => React.ReactNode;
-  /** Datum for which to render a link. */
-  data: Link;
-};
+export * from './base';
+
+export * from './accessor';
+export * from './area';
+export * from './barGroup';
+export * from './barStack';
+export * from './D3ShapeConfig';
+export * from './link';
+export * from './stack';
diff --git a/packages/vx-shape/src/types/link.ts b/packages/vx-shape/src/types/link.ts
new file mode 100644
index 0000000000..3ab0edc9c1
--- /dev/null
+++ b/packages/vx-shape/src/types/link.ts
@@ -0,0 +1,35 @@
+export type AccessorProps<Link, Node> = {
+  /** Given a node, returns its x coordinate. */
+  x?: (node: Node) => number;
+  /** Given a node, returns its y coordinate. */
+  y?: (node: Node) => number;
+  /** Given a link, returns the source node. */
+  source?: (link: Link) => Node;
+  /** Given a link, returns the target node. */
+  target?: (link: Link) => Node;
+};
+
+export type RadialAccessorProps<Link, Node> = Pick<
+  AccessorProps<Link, Node>,
+  'source' | 'target'
+> & {
+  /** Given a node, returns its x coordinate. */
+  angle?: (node: Node) => number;
+  /** Given a node, returns its y coordinate. */
+  radius?: (node: Node) => number;
+};
+
+type PathType<Link> = (link: Link) => string | null;
+
+export type SharedLinkProps<Link> = {
+  /** className applied to path element. */
+  className?: string;
+  /** React ref to the path element. */
+  innerRef?: React.Ref<SVGPathElement>;
+  /** Path generator, given a link returns a path d attribute string */
+  path?: PathType<Link>;
+  /** Render function override which is passed the configured path generator as input. */
+  children?: (args: { path: PathType<Link> }) => React.ReactNode;
+  /** Datum for which to render a link. */
+  data: Link;
+};
diff --git a/packages/vx-shape/src/types/stack.ts b/packages/vx-shape/src/types/stack.ts
index a517f41e63..52ee1c8dcb 100644
--- a/packages/vx-shape/src/types/stack.ts
+++ b/packages/vx-shape/src/types/stack.ts
@@ -1,11 +1,11 @@
-import { SeriesPoint } from 'd3-shape';
-
 import { STACK_ORDERS } from '../util/stackOrder';
 import { STACK_OFFSETS } from '../util/stackOffset';
-import { BarGroupBar } from './bar';
+
+/** Unique key for item in a stack. */
+export type StackKey = string | number;
 
 export type BaseStackProps<Datum, Key> = {
-  /** Array of data for which to generate a stack. */
+  /** Array of data for which generates a stack. */
   data: Datum[];
   /** className applied to path element. */
   className?: string;
@@ -22,22 +22,3 @@ export type BaseStackProps<Datum, Key> = {
   /** Sets the value accessor for a Datum, which defaults to d[key]. */
   value?: number | ((d: Datum, key: Key) => number);
 };
-
-/** One BarStack is returned for each datum, which has multiple sub-bars (based on keys). */
-export interface BarStack<Datum, Key> {
-  index: number;
-  key: Key;
-  bars: (Omit<BarGroupBar<Key>, 'key' | 'value'> & {
-    /** Processed bar Datum with bar bounds and original datum. */
-    bar: SeriesPoint<Datum>;
-    /** stack key */
-    key: Key;
-  })[];
-}
-
-export type BaseBarStackProps<Datum, Key> = BaseStackProps<Datum, Key> & {
-  /** Returns the desired color for a bar with a given key and index. */
-  color: (key: Key, index: number) => string;
-  /** Override render function which is passed the configured arc generator as input. */
-  children?: (stacks: BarStack<Datum, Key>[]) => React.ReactNode;
-};
diff --git a/packages/vx-shape/src/util/D3ShapeFactories.ts b/packages/vx-shape/src/util/D3ShapeFactories.ts
new file mode 100644
index 0000000000..4114629362
--- /dev/null
+++ b/packages/vx-shape/src/util/D3ShapeFactories.ts
@@ -0,0 +1,100 @@
+import {
+  arc as d3Arc,
+  area as d3Area,
+  line as d3Line,
+  pie as d3Pie,
+  radialLine as d3RadialLine,
+} from 'd3-shape';
+import setNumberOrNumberAccessor from './setNumberOrNumberAccessor';
+import {
+  ArcPathConfig,
+  AreaPathConfig,
+  LinePathConfig,
+  PiePathConfig,
+  RadialLinePathConfig,
+} from '../types';
+
+export function arc<Datum>({
+  innerRadius,
+  outerRadius,
+  cornerRadius,
+  startAngle,
+  endAngle,
+  padAngle,
+  padRadius,
+}: ArcPathConfig<Datum> = {}) {
+  const path = d3Arc<Datum>();
+  if (innerRadius != null) setNumberOrNumberAccessor(path.innerRadius, innerRadius);
+  if (outerRadius != null) setNumberOrNumberAccessor(path.outerRadius, outerRadius);
+  if (cornerRadius != null) setNumberOrNumberAccessor(path.cornerRadius, cornerRadius);
+  if (startAngle != null) setNumberOrNumberAccessor(path.startAngle, startAngle);
+  if (endAngle != null) setNumberOrNumberAccessor(path.endAngle, endAngle);
+  if (padAngle != null) setNumberOrNumberAccessor(path.padAngle, padAngle);
+  if (padRadius != null) setNumberOrNumberAccessor(path.padRadius, padRadius);
+
+  return path;
+}
+
+export function area<Datum>({ x, x0, x1, y, y0, y1, defined, curve }: AreaPathConfig<Datum> = {}) {
+  const path = d3Area<Datum>();
+  if (x) setNumberOrNumberAccessor(path.x, x);
+  if (x0) setNumberOrNumberAccessor(path.x0, x0);
+  if (x1) setNumberOrNumberAccessor(path.x1, x1);
+  if (y) setNumberOrNumberAccessor(path.y, y);
+  if (y0) setNumberOrNumberAccessor(path.y0, y0);
+  if (y1) setNumberOrNumberAccessor(path.y1, y1);
+  if (defined) path.defined(defined);
+  if (curve) path.curve(curve);
+
+  return path;
+}
+
+export function line<Datum>({ x, y, defined, curve }: LinePathConfig<Datum> = {}) {
+  const path = d3Line<Datum>();
+  if (x) setNumberOrNumberAccessor(path.x, x);
+  if (y) setNumberOrNumberAccessor(path.y, y);
+  if (defined) path.defined(defined);
+  if (curve) path.curve(curve);
+
+  return path;
+}
+
+export function pie<Datum>({
+  startAngle,
+  endAngle,
+  padAngle,
+  value,
+  sort,
+  sortValues,
+}: PiePathConfig<Datum> = {}) {
+  const path = d3Pie<Datum>();
+
+  // ts can't distinguish between these method overloads
+  if (sort === null) path.sort(sort);
+  else if (sort != null) path.sort(sort);
+  if (sortValues === null) path.sortValues(sortValues);
+  else if (sortValues != null) path.sortValues(sortValues);
+
+  if (value != null) path.value(value);
+
+  if (padAngle != null) setNumberOrNumberAccessor(path.padAngle, padAngle);
+  if (startAngle != null) setNumberOrNumberAccessor(path.startAngle, startAngle);
+  if (endAngle != null) setNumberOrNumberAccessor(path.endAngle, endAngle);
+
+  return path;
+}
+
+export function radialLine<Datum>({
+  angle,
+  radius,
+  defined,
+  curve,
+}: RadialLinePathConfig<Datum> = {}) {
+  const path = d3RadialLine<Datum>();
+  if (angle) setNumberOrNumberAccessor(path.angle, angle);
+  if (radius) setNumberOrNumberAccessor(path.radius, radius);
+  if (defined) path.defined(defined);
+  if (curve) path.curve(curve);
+
+  return path;
+}
diff --git a/packages/vx-shape/src/util/accessors.ts b/packages/vx-shape/src/util/accessors.ts
index 0c07cc2e64..8c70925ac5 100644
--- a/packages/vx-shape/src/util/accessors.ts
+++ b/packages/vx-shape/src/util/accessors.ts
@@ -15,3 +15,11 @@ export function getSource(l: $TSFIXME) {
 export function getTarget(l: $TSFIXME) {
   return l?.target;
 }
+
+export function getFirstItem(d: $TSFIXME[]) {
+  return d?.[0];
+}
+
+export function getSecondItem(d: $TSFIXME[]) {
+  return d?.[1];
+}
diff --git a/packages/vx-shape/test/AreaClosed.test.tsx b/packages/vx-shape/test/AreaClosed.test.tsx
index fe033472ed..a71dcf5bf8 100644
--- a/packages/vx-shape/test/AreaClosed.test.tsx
+++ b/packages/vx-shape/test/AreaClosed.test.tsx
@@ -18,16 +18,6 @@ const data: Datum[] = [
 
 const yScale = scaleLinear({ domain: [0, 100], range: [100, 0] });
 
-// const xScale = () => 50;
-// xScale.range = () => [0, 100];
-// xScale.domain = () => [0, 100];
-// xScale.copy = () => xScale;
-
-// const yScale = () => 50;
-// yScale.range = () => [100, 0] as [number, number];
-// yScale.domain = () => [0, 100] as [number, number];
-// yScale.copy = () => yScale;
-
 const x = () => 50;
 const y = () => 50;
 
diff --git a/packages/vx-shape/test/Bar.test.tsx b/packages/vx-shape/test/Bar.test.tsx
index 5c57e18ef3..a1a7f712ae 100644
--- a/packages/vx-shape/test/Bar.test.tsx
+++ b/packages/vx-shape/test/Bar.test.tsx
@@ -19,6 +19,7 @@ describe('<Bar />', () => {
   });
 
   test('it should expose its ref via an innerRef prop', () => {
+    // eslint-disable-next-line jest/no-test-return-statement
     return new Promise(done => {
       const refCallback = (ref: SVGRectElement) => {
         expect(ref.tagName).toMatch('rect');
diff --git a/packages/vx-shape/test/BarGroup.test.tsx b/packages/vx-shape/test/BarGroup.test.tsx
index 026d09b812..14b7b49892 100644
--- a/packages/vx-shape/test/BarGroup.test.tsx
+++ b/packages/vx-shape/test/BarGroup.test.tsx
@@ -4,7 +4,7 @@ import { shallow } from 'enzyme';
 import { scaleBand, scaleLinear } from '@vx/scale';
 import { BarGroup } from '../src';
 import { BarGroupProps } from '../src/shapes/BarGroup';
-import { GroupKey } from '../src/types';
+import { GroupKey } from '../src/types/barGroup';
 
 interface Datum {
   date: Date;
@@ -33,23 +33,6 @@ const x0Scale = scaleBand({ domain: [0, 100], range: [0, 100] });
 const x1Scale = scaleBand({ domain: [0, 100], range: [0, 100] });
 const yScale = scaleLinear({ domain: [0, 100], range: [0, 100] });
 
-// const x0Scale = () => 2;
-// x0Scale.bandwidth = () => 10;
-// x0Scale.domain = () => [0, 100] as [number, number];
-// x0Scale.range = () => [0, 100] as [number, number];
-// x0Scale.copy = () => x0Scale;
-
-// const x1Scale = () => 5;
-// x1Scale.bandwidth = () => 2;
-// x1Scale.domain = () => [0, 100] as [number, number];
-// x1Scale.range = () => [0, 100] as [number, number];
-// x1Scale.copy = () => x1Scale;
-
-// const yScale = () => 5;
-// yScale.domain = () => [0, 100] as [number, number];
-// yScale.range = () => [0, 100] as [number, number];
-// yScale.copy = () => yScale;
-
 const color = () => 'skyblue';
 const keys = ['New York', 'San Francisco', 'Austin'];
 const height = 1;
diff --git a/packages/vx-shape/test/BarGroupHorizontal.test.tsx b/packages/vx-shape/test/BarGroupHorizontal.test.tsx
index 3d31441e7b..894b4ffe11 100644
--- a/packages/vx-shape/test/BarGroupHorizontal.test.tsx
+++ b/packages/vx-shape/test/BarGroupHorizontal.test.tsx
@@ -31,23 +31,6 @@ const y0 = () => 5;
 const y0Scale = scaleBand({ domain: [0, 100], range: [0, 100] });
 const y1Scale = scaleBand({ domain: [0, 100], range: [0, 100] });
 const xScale = scaleLinear({ domain: [0, 100], range: [0, 100] });
-
-// const y0 = () => 1;
-// const y0Scale = () => 2;
-// y0Scale.bandwidth = () => 10;
-// y0Scale.domain = () => [0, 100] as [number, number];
-// y0Scale.range = () => [0, 100] as [number, number];
-// y0Scale.copy = () => y0Scale;
-// const y1Scale = () => 1;
-// y1Scale.bandwidth = () => 2;
-// y1Scale.domain = () => [0, 100] as [number, number];
-// y1Scale.range = () => [0, 100] as [number, number];
-// y1Scale.copy = () => y1Scale;
-// const xScale = (d: Datum) => 5;
-// xScale.domain = () => [0, 100] as [number, number];
-// xScale.range = () => [0, 100] as [number, number];
-// xScale.copy = () => xScale;
-
 const color = () => 'violet';
 const keys = ['New York', 'San Francisco', 'Austin'];
 const width = 1;
diff --git a/packages/vx-shape/test/BarRounded.test.tsx b/packages/vx-shape/test/BarRounded.test.tsx
index 0e1f216cc1..1e80f220aa 100644
--- a/packages/vx-shape/test/BarRounded.test.tsx
+++ b/packages/vx-shape/test/BarRounded.test.tsx
@@ -20,6 +20,7 @@ describe('<BarRounded />', () => {
   });
 
   test('it should expose its ref via an innerRef prop', () => {
+    // eslint-disable-next-line jest/no-test-return-statement
     return new Promise(done => {
       const refCallback = (ref: SVGPathElement) => {
         expect(ref.tagName).toMatch('path');
diff --git a/packages/vx-shape/test/BarStack.test.tsx b/packages/vx-shape/test/BarStack.test.tsx
index 3928ffdf66..e659922361 100644
--- a/packages/vx-shape/test/BarStack.test.tsx
+++ b/packages/vx-shape/test/BarStack.test.tsx
@@ -8,13 +8,6 @@ const scale = scaleBand({
   range: [0, 100],
 });
 
-// const scale = () => 2;
-// scale.domain = () => [0, 100] as [number, number];
-// scale.range = () => [0, 100] as [number, number];
-// scale.bandwidth = () => 2;
-// scale.step = () => 2;
-// scale.copy = () => scale;
-
 describe('<BarStack />', () => {
   test('it should be defined', () => {
     expect(BarStack).toBeDefined();
diff --git a/packages/vx-shape/test/BarStackHorizontal.test.tsx b/packages/vx-shape/test/BarStackHorizontal.test.tsx
index 76eb4da742..4763ee2730 100644
--- a/packages/vx-shape/test/BarStackHorizontal.test.tsx
+++ b/packages/vx-shape/test/BarStackHorizontal.test.tsx
@@ -11,15 +11,6 @@ const scale = scaleBand({
   paddingOuter: 5,
 });
 
-// const scale = () => 5;
-// scale.domain = () => [0, 100] as [number, number];
-// scale.range = () => [0, 100] as [number, number];
-// scale.bandwidth = () => 5;
-// scale.step = () => 5;
-// scale.paddingInner = () => 5;
-// scale.paddingOuter = () => 5;
-// scale.copy = () => scale;
-
 describe('<BarStackHorizontal />', () => {
   test('it should be defined', () => {
     expect(BarStackHorizontal).toBeDefined();