diff --git a/packages/dx-chart-core/src/index.ts b/packages/dx-chart-core/src/index.ts
index 231905c21b..89a7ba6c97 100644
--- a/packages/dx-chart-core/src/index.ts
+++ b/packages/dx-chart-core/src/index.ts
@@ -5,7 +5,7 @@ export * from './plugins/series/computeds';
 export * from './plugins/stack/computeds';
 export * from './plugins/animation/computeds';
 export * from './plugins/tooltip/computeds';
-export * from './plugins/zoom-pan/computeds';
+export * from './plugins/zoom-and-pan/computeds';
 export * from './utils/series';
 export * from './utils/scale';
 export * from './utils/legend';
diff --git a/packages/dx-chart-core/src/plugins/zoom-pan/computeds.test.ts b/packages/dx-chart-core/src/plugins/zoom-and-pan/computeds.test.ts
similarity index 99%
rename from packages/dx-chart-core/src/plugins/zoom-pan/computeds.test.ts
rename to packages/dx-chart-core/src/plugins/zoom-and-pan/computeds.test.ts
index 5deec789c3..66e6aa4930 100644
--- a/packages/dx-chart-core/src/plugins/zoom-pan/computeds.test.ts
+++ b/packages/dx-chart-core/src/plugins/zoom-and-pan/computeds.test.ts
@@ -9,7 +9,7 @@ import {
   adjustLayout, getViewport, getDeltaForTouches, isKeyPressed, getWheelDelta, isMultiTouch,
   attachEvents, detachEvents, getRect,
 } from './computeds';
-import { ScalesCache, ViewportOptions } from '../../types';
+import { ScalesCache, Viewport } from '../../types';
 
 jest.mock('../../utils/scale', () => ({
   ...require.requireActual('../../utils/scale'),  // for `rangesEqual`
@@ -170,7 +170,7 @@ describe('ZoomAndPan', () => {
       [ARGUMENT_DOMAIN]: argScale,
       'domain-1': valScale,
     } as any;
-    const viewport: ViewportOptions = {
+    const viewport: Viewport = {
       argumentStart: 'A', argumentEnd: 'B',
       valueStart: 100, valueEnd: 200,
     };
diff --git a/packages/dx-chart-core/src/plugins/zoom-pan/computeds.ts b/packages/dx-chart-core/src/plugins/zoom-and-pan/computeds.ts
similarity index 95%
rename from packages/dx-chart-core/src/plugins/zoom-pan/computeds.ts
rename to packages/dx-chart-core/src/plugins/zoom-and-pan/computeds.ts
index 7952d15977..818f3c809d 100644
--- a/packages/dx-chart-core/src/plugins/zoom-pan/computeds.ts
+++ b/packages/dx-chart-core/src/plugins/zoom-and-pan/computeds.ts
@@ -7,7 +7,7 @@ import {
 } from '../../utils/scale';
 import {
   NumberArray,
-  ViewportOptions,
+  Viewport,
   ScalesCache,
   DomainInfoCache,
   RangesCache,
@@ -21,17 +21,17 @@ import {
 } from '../../types';
 import { Size } from '@devexpress/dx-react-core';
 
-const getArgumentBounds = (viewport?: ViewportOptions): DomainBounds | null => (
+const getArgumentBounds = (viewport?: Viewport): DomainBounds | null => (
   viewport && viewport.argumentStart !== undefined && viewport.argumentEnd !== undefined
     ? [viewport.argumentStart, viewport.argumentEnd] : null
 );
 
-const getValueBounds = (viewport?: ViewportOptions): DomainBounds | null => (
+const getValueBounds = (viewport?: Viewport): DomainBounds | null => (
   viewport && viewport.valueStart !== undefined && viewport.valueEnd !== undefined
     ? [viewport.valueStart, viewport.valueEnd] : null
 );
 
-const getValueScaleName = (viewport?: ViewportOptions) => (
+const getValueScaleName = (viewport?: Viewport) => (
   getValueDomainName(viewport && viewport.scaleName)
 );
 
@@ -66,7 +66,7 @@ const update = (
 
 /** @internal */
 export const adjustLayout = (
-  domains: DomainInfoCache, ranges: RangesCache, viewport?: ViewportOptions,
+  domains: DomainInfoCache, ranges: RangesCache, viewport?: Viewport,
 ) => {
   const changes = {};
   const argumentBounds = getArgumentBounds(viewport);
@@ -105,7 +105,7 @@ export const getViewport = (
   deltas: Readonly<[number, number]> | null,
   anchors: Readonly<[number, number]> | null,
   ranges: Readonly<[NumberArray, NumberArray]> | null,
-  viewport?: ViewportOptions, onViewportChange?: OnViewportChangeFn,
+  viewport?: Viewport, onViewportChange?: OnViewportChangeFn,
 ) => {
   const changes: any = {};
   const argumentBounds = boundsForScale(
diff --git a/packages/dx-chart-core/src/types/index.ts b/packages/dx-chart-core/src/types/index.ts
index 45bc72d092..3465d780e0 100644
--- a/packages/dx-chart-core/src/types/index.ts
+++ b/packages/dx-chart-core/src/types/index.ts
@@ -6,7 +6,7 @@ export * from './plugins.scale.types';
 export * from './plugins.layout-manager.types';
 export * from './plugins.axis.types';
 export * from './plugins.animation.types';
-export * from './plugins.zoom-pan.types';
+export * from './plugins.zoom-and-pan.types';
 export * from './utils.event-tracker.types';
 export * from './utils.hover-state.types';
 export * from './utils.legend.types';
diff --git a/packages/dx-chart-core/src/types/plugins.zoom-pan.types.ts b/packages/dx-chart-core/src/types/plugins.zoom-and-pan.types.ts
similarity index 73%
rename from packages/dx-chart-core/src/types/plugins.zoom-pan.types.ts
rename to packages/dx-chart-core/src/types/plugins.zoom-and-pan.types.ts
index a652389220..c2b5e36beb 100644
--- a/packages/dx-chart-core/src/types/plugins.zoom-pan.types.ts
+++ b/packages/dx-chart-core/src/types/plugins.zoom-and-pan.types.ts
@@ -1,7 +1,7 @@
 /** @internal */
 export type DomainBounds = Readonly<[any, any]>;
 
-export type ViewportOptions = {
+export type Viewport = {
   readonly argumentStart?: any;
   readonly argumentEnd?: any;
   readonly scaleName?: string;
@@ -9,6 +9,6 @@ export type ViewportOptions = {
   readonly valueEnd?: any;
 };
 
-export type OnViewportChangeFn = (viewport: ViewportOptions) => void;
+export type OnViewportChangeFn = (viewport: Viewport) => void;
 
 export type Interaction = 'none' | 'pan' | 'zoom' | 'both';
diff --git a/packages/dx-react-chart-bootstrap4/api/dx-react-chart-bootstrap4.api.md b/packages/dx-react-chart-bootstrap4/api/dx-react-chart-bootstrap4.api.md
index 28633bf478..86ed1bd3e4 100644
--- a/packages/dx-react-chart-bootstrap4/api/dx-react-chart-bootstrap4.api.md
+++ b/packages/dx-react-chart-bootstrap4/api/dx-react-chart-bootstrap4.api.md
@@ -19,6 +19,8 @@ import { SplineSeries as SplineSeries_2 } from '@devexpress/dx-react-chart';
 import { Title as Title_2 } from '@devexpress/dx-react-chart';
 import { Tooltip as Tooltip_2 } from '@devexpress/dx-react-chart';
 import { ValueAxis as ValueAxis_2 } from '@devexpress/dx-react-chart';
+import { Viewport } from '@devexpress/dx-react-chart';
+import { ZoomAndPan as ZoomAndPan_2 } from '@devexpress/dx-react-chart';
 
 // @public (undocumented)
 export namespace AreaSeries {
@@ -343,6 +345,27 @@ export interface ValueAxisProps {
   tickSize?: number;
 }
 
+// @public (undocumented)
+export namespace ZoomAndPan {
+  export type DragBoxProps = ZoomAndPan_2.DragBoxProps;
+}
+
+// @public
+export const ZoomAndPan: React.ComponentType<ZoomAndPanProps> & {
+  DragBox: React.ComponentType<ZoomAndPan_2.DragBoxProps & { className?: string; style?: React.CSSProperties; [x: string]: any }>;
+};
+
+// @public (undocumented)
+export interface ZoomAndPanProps {
+  defaultViewport?: Viewport;
+  dragBoxComponent?: React.ComponentType<ZoomAndPan_2.DragBoxProps>;
+  interactionWithArguments?: 'none' | 'pan' | 'zoom' | 'both';
+  interactionWithValues?: 'none' | 'pan' | 'zoom' | 'both';
+  onViewportChange?: (viewport: Viewport) => void;
+  viewport?: Viewport;
+  zoomRegionKey?: 'shift' | 'alt' | 'ctrl';
+}
+
 
 // (No @packageDocumentation comment for this package)
 
diff --git a/packages/dx-react-chart-bootstrap4/src/index.js b/packages/dx-react-chart-bootstrap4/src/index.js
index 28369854c8..e9cf6a2b38 100644
--- a/packages/dx-react-chart-bootstrap4/src/index.js
+++ b/packages/dx-react-chart-bootstrap4/src/index.js
@@ -15,4 +15,4 @@ export { ValueAxis } from './plugins/value-axis';
 export { ArgumentAxis } from './plugins/argument-axis';
 
 export { Tooltip } from './plugins/tooltip';
-export { ZoomAndPan } from './plugins/zoom-pan';
+export { ZoomAndPan } from './plugins/zoom-and-pan';
diff --git a/packages/dx-react-chart-bootstrap4/src/plugins/zoom-pan.jsx b/packages/dx-react-chart-bootstrap4/src/plugins/zoom-and-pan.jsx
similarity index 76%
rename from packages/dx-react-chart-bootstrap4/src/plugins/zoom-pan.jsx
rename to packages/dx-react-chart-bootstrap4/src/plugins/zoom-and-pan.jsx
index 4004564292..37c543fc19 100644
--- a/packages/dx-react-chart-bootstrap4/src/plugins/zoom-pan.jsx
+++ b/packages/dx-react-chart-bootstrap4/src/plugins/zoom-and-pan.jsx
@@ -1,5 +1,5 @@
 import { ZoomAndPan as ZoomAndPanBase } from '@devexpress/dx-react-chart';
 import { withComponents } from '@devexpress/dx-react-core';
-import { DragBox } from '../templates/zoom-pan/drag-box';
+import { DragBox } from '../templates/zoom-and-pan/drag-box';
 
 export const ZoomAndPan = withComponents({ DragBox })(ZoomAndPanBase);
diff --git a/packages/dx-react-chart-bootstrap4/src/templates/zoom-pan/drag-box.jsx b/packages/dx-react-chart-bootstrap4/src/templates/zoom-and-pan/drag-box.jsx
similarity index 100%
rename from packages/dx-react-chart-bootstrap4/src/templates/zoom-pan/drag-box.jsx
rename to packages/dx-react-chart-bootstrap4/src/templates/zoom-and-pan/drag-box.jsx
diff --git a/packages/dx-react-chart-material-ui/api/dx-react-chart-material-ui.api.md b/packages/dx-react-chart-material-ui/api/dx-react-chart-material-ui.api.md
index 8d88aba8a8..0361be960a 100644
--- a/packages/dx-react-chart-material-ui/api/dx-react-chart-material-ui.api.md
+++ b/packages/dx-react-chart-material-ui/api/dx-react-chart-material-ui.api.md
@@ -19,6 +19,8 @@ import { SplineSeries as SplineSeries_2 } from '@devexpress/dx-react-chart';
 import { Title as Title_2 } from '@devexpress/dx-react-chart';
 import { Tooltip as Tooltip_2 } from '@devexpress/dx-react-chart';
 import { ValueAxis as ValueAxis_2 } from '@devexpress/dx-react-chart';
+import { Viewport } from '@devexpress/dx-react-chart';
+import { ZoomAndPan as ZoomAndPan_2 } from '@devexpress/dx-react-chart';
 
 // @public (undocumented)
 export namespace AreaSeries {
@@ -343,6 +345,27 @@ export interface ValueAxisProps {
   tickSize?: number;
 }
 
+// @public (undocumented)
+export namespace ZoomAndPan {
+  export type DragBoxProps = ZoomAndPan_2.DragBoxProps;
+}
+
+// @public
+export const ZoomAndPan: React.ComponentType<ZoomAndPanProps> & {
+  DragBox: React.ComponentType<ZoomAndPan_2.DragBoxProps & { className?: string; style?: React.CSSProperties; [x: string]: any }>;
+};
+
+// @public (undocumented)
+export interface ZoomAndPanProps {
+  defaultViewport?: Viewport;
+  dragBoxComponent?: React.ComponentType<ZoomAndPan_2.DragBoxProps>;
+  interactionWithArguments?: 'none' | 'pan' | 'zoom' | 'both';
+  interactionWithValues?: 'none' | 'pan' | 'zoom' | 'both';
+  onViewportChange?: (viewport: Viewport) => void;
+  viewport?: Viewport;
+  zoomRegionKey?: 'shift' | 'alt' | 'ctrl';
+}
+
 
 // (No @packageDocumentation comment for this package)
 
diff --git a/packages/dx-react-chart-material-ui/src/index.js b/packages/dx-react-chart-material-ui/src/index.js
index 5cbda94bff..fbf1a306b9 100644
--- a/packages/dx-react-chart-material-ui/src/index.js
+++ b/packages/dx-react-chart-material-ui/src/index.js
@@ -13,4 +13,4 @@ export { ValueAxis } from './plugins/value-axis';
 export { ArgumentAxis } from './plugins/argument-axis';
 
 export { Tooltip } from './plugins/tooltip';
-export { ZoomAndPan } from './plugins/zoom-pan';
+export { ZoomAndPan } from './plugins/zoom-and-pan';
diff --git a/packages/dx-react-chart-material-ui/src/plugins/zoom-pan.jsx b/packages/dx-react-chart-material-ui/src/plugins/zoom-and-pan.jsx
similarity index 76%
rename from packages/dx-react-chart-material-ui/src/plugins/zoom-pan.jsx
rename to packages/dx-react-chart-material-ui/src/plugins/zoom-and-pan.jsx
index 4004564292..37c543fc19 100644
--- a/packages/dx-react-chart-material-ui/src/plugins/zoom-pan.jsx
+++ b/packages/dx-react-chart-material-ui/src/plugins/zoom-and-pan.jsx
@@ -1,5 +1,5 @@
 import { ZoomAndPan as ZoomAndPanBase } from '@devexpress/dx-react-chart';
 import { withComponents } from '@devexpress/dx-react-core';
-import { DragBox } from '../templates/zoom-pan/drag-box';
+import { DragBox } from '../templates/zoom-and-pan/drag-box';
 
 export const ZoomAndPan = withComponents({ DragBox })(ZoomAndPanBase);
diff --git a/packages/dx-react-chart-material-ui/src/templates/zoom-pan/drag-box.jsx b/packages/dx-react-chart-material-ui/src/templates/zoom-and-pan/drag-box.jsx
similarity index 100%
rename from packages/dx-react-chart-material-ui/src/templates/zoom-pan/drag-box.jsx
rename to packages/dx-react-chart-material-ui/src/templates/zoom-and-pan/drag-box.jsx
diff --git a/packages/dx-react-chart/api/dx-react-chart.api.md b/packages/dx-react-chart/api/dx-react-chart.api.md
index b276676631..96766dcdcb 100644
--- a/packages/dx-react-chart/api/dx-react-chart.api.md
+++ b/packages/dx-react-chart/api/dx-react-chart.api.md
@@ -254,7 +254,7 @@ export type NumberArray = [number, number];
 export type OffsetFn = (series: StackData, order: number[]) => void;
 
 // @public (undocumented)
-export type OnViewportChangeFn = (viewport: ViewportOptions) => void;
+export type OnViewportChangeFn = (viewport: Viewport) => void;
 
 // @public (undocumented)
 export type OrderFn = (series: StackData) => number[];
@@ -596,7 +596,7 @@ export interface ValueScaleProps extends ScaleProps {
 }
 
 // @public (undocumented)
-export type ViewportOptions = {
+export type Viewport = {
   readonly argumentStart?: any;
   readonly argumentEnd?: any;
   readonly scaleName?: string;
@@ -617,12 +617,12 @@ export namespace ZoomAndPan {
 
 // @public (undocumented)
 export interface ZoomAndPanProps {
-  defaultViewport?: ViewportOptions;
+  defaultViewport?: Viewport;
   dragBoxComponent: React.ComponentType<ZoomAndPan.DragBoxProps>;
   interactionWithArguments?: Interaction;
   interactionWithValues?: Interaction;
   onViewportChange?: OnViewportChangeFn;
-  viewport?: ViewportOptions;
+  viewport?: Viewport;
   zoomRegionKey?: 'shift' | 'alt' | 'ctrl';
 }
 
diff --git a/packages/dx-react-chart/docs/reference/zoom-and-pan.md b/packages/dx-react-chart/docs/reference/zoom-and-pan.md
index 7ac93751db..81dd21d094 100644
--- a/packages/dx-react-chart/docs/reference/zoom-and-pan.md
+++ b/packages/dx-react-chart/docs/reference/zoom-and-pan.md
@@ -23,9 +23,9 @@ import { ZoomAndPan } from '@devexpress/dx-react-chart';
 
 Name | Type | Default | Description
 -----|------|---------|------------
-defaultViewport? | [ZoomAndPan.Viewport](#zoomandpanviewport) | The default viewport.
-viewport? | [ZoomAndPan.Viewport](#zoomandpanviewport) | The viewport.
-onViewportChange? | (viewport: [ZoomAndPan.Viewport](#zoomandpanviewport)) => void | A function that is executed when the viewport changes.
+defaultViewport? | [Viewport](#viewport) | The default viewport.
+viewport? | [Viewport](#viewport) | The viewport.
+onViewportChange? | (viewport: [Viewport](#viewport)) => void | A function that is executed when the viewport changes.
 interactionWithArguments? | 'none' &#124; 'pan' &#124; 'zoom' &#124; 'both' | The type of interaction available for the argument scale.
 interactionWithValues? | 'none' &#124; 'pan' &#124; 'zoom' &#124; 'both' | The type of interaction available for the value scale.
 zoomRegionKey? | 'shift' &#124; 'alt' &#124; 'ctrl' | The key the allows a user to zoom a region by selecting it with the mouse drag gesture.
@@ -33,7 +33,7 @@ dragBoxComponent? | ComponentType&lt;[ZoomAndPan.DragBoxProps](#zoomandpandragbo
 
 ## Interfaces
 
-### ZoomAndPan.Viewport
+### Viewport
 
 The viewport configuration.
 
diff --git a/packages/dx-react-chart/src/index.ts b/packages/dx-react-chart/src/index.ts
index d3c5c6e454..6b8b8bef27 100644
--- a/packages/dx-react-chart/src/index.ts
+++ b/packages/dx-react-chart/src/index.ts
@@ -17,7 +17,7 @@ export { SplineSeries } from './plugins/spline-series';
 export { Axis, ArgumentAxis, ValueAxis } from './plugins/axis';
 export { Tooltip } from './plugins/tooltip';
 
-export * from './plugins/zoom-pan';
+export * from './plugins/zoom-and-pan';
 
 export * from './plugins/event-tracker';
 export * from './plugins/hover-state';
diff --git a/packages/dx-react-chart/src/plugins/zoom-pan.test.tsx b/packages/dx-react-chart/src/plugins/zoom-and-pan.test.tsx
similarity index 98%
rename from packages/dx-react-chart/src/plugins/zoom-pan.test.tsx
rename to packages/dx-react-chart/src/plugins/zoom-and-pan.test.tsx
index 026b63ee15..6a7bf173c7 100644
--- a/packages/dx-react-chart/src/plugins/zoom-pan.test.tsx
+++ b/packages/dx-react-chart/src/plugins/zoom-and-pan.test.tsx
@@ -5,7 +5,7 @@ import {
   pluginDepsToComponents, getComputedState,
 } from '@devexpress/dx-testing';
 import { adjustLayout, attachEvents, detachEvents } from '@devexpress/dx-chart-core';
-import { ZoomAndPan } from './zoom-pan';
+import { ZoomAndPan } from './zoom-and-pan';
 
 jest.mock('@devexpress/dx-chart-core', () => ({
   adjustLayout: jest.fn().mockReturnValue('adjusted-ranges'),
diff --git a/packages/dx-react-chart/src/plugins/zoom-pan.tsx b/packages/dx-react-chart/src/plugins/zoom-and-pan.tsx
similarity index 100%
rename from packages/dx-react-chart/src/plugins/zoom-pan.tsx
rename to packages/dx-react-chart/src/plugins/zoom-and-pan.tsx
diff --git a/packages/dx-react-chart/src/types/index.ts b/packages/dx-react-chart/src/types/index.ts
index 0532ced95b..5b2f4a6c40 100644
--- a/packages/dx-react-chart/src/types/index.ts
+++ b/packages/dx-react-chart/src/types/index.ts
@@ -7,7 +7,7 @@ export {
   BBoxes, BBoxesChange,
   StackList, StacksOptions, OffsetFn, OrderFn,
   EventHandlers, NumberArray, Location,
-  DomainBounds, ViewportOptions, OnViewportChangeFn, EventHandlerFn,
+  DomainBounds, Viewport, OnViewportChangeFn, EventHandlerFn,
 
   AreaSeries, LineSeries, SplineSeries, BarSeries, ScatterSeries, PieSeries,
   SeriesProps, PathComponentProps, PathComponentPathProps, PointComponentProps,
diff --git a/packages/dx-react-chart/src/types/plugins.zoom-pan.types.ts b/packages/dx-react-chart/src/types/plugins.zoom-pan.types.ts
index 3636813f2e..f97583734e 100644
--- a/packages/dx-react-chart/src/types/plugins.zoom-pan.types.ts
+++ b/packages/dx-react-chart/src/types/plugins.zoom-pan.types.ts
@@ -1,5 +1,5 @@
 import {
-  ViewportOptions,
+  Viewport,
   OnViewportChangeFn,
   EventHandlerFn,
   Interaction,
@@ -7,9 +7,9 @@ import {
 
 export interface ZoomAndPanProps {
   /** A default viewport */
-  defaultViewport?: ViewportOptions;
+  defaultViewport?: Viewport;
   /** A viewport */
-  viewport?: ViewportOptions;
+  viewport?: Viewport;
   /** A function that is executed when viewport changes */
   onViewportChange?: OnViewportChangeFn;
   /** Interaction with arguments */
@@ -26,7 +26,7 @@ type Rect = { x: number; y: number; width: number; height: number; };
 
 /** @internal */
 export type ZoomAndPanState = {
-  viewport?: ViewportOptions;
+  viewport?: Viewport;
   rectBox?: Rect | null;
 };