<!-- API Report Version: 2.3 -->

## API Report File for "@atlaskit/media-filmstrip"

> Do not edit this file. This report is auto-generated using
> [API Extractor](https://api-extractor.com/).
> [Learn more about API reports](https://hello.atlassian.net/wiki/spaces/UR/pages/1825484529/Package+API+Reports)

### Table of contents

- [Main Entry Types](#main-entry-types)
- [Peer Dependencies](#peer-dependencies)

### Main Entry Types

<!--SECTION START: Main Entry Types-->

```ts
import { CardAction } from '@atlaskit/media-card';
import { CardEvent } from '@atlaskit/media-card';
import { CardOnClickCallback } from '@atlaskit/media-card';
import { Component } from 'react';
import { Identifier } from '@atlaskit/media-client';
import { MediaClientConfig } from '@atlaskit/media-core';
import { MediaFeatureFlags } from '@atlaskit/media-common';
import { MouseEvent as MouseEvent_2 } from 'react';
import { default as React_2 } from 'react';
import { ReactNode } from 'react';
import { WheelEvent as WheelEvent_2 } from 'react';

// @public (undocumented)
export interface ArrowProps {
	// (undocumented)
	onClick: (event: MouseEvent_2<HTMLDivElement>) => void;
}

// @public (undocumented)
export interface ChildOffset {
	// (undocumented)
	left: number;
	// (undocumented)
	right: number;
}

// @public (undocumented)
export class Filmstrip extends Component<FilmstripProps, FilmstripState> {
	// (undocumented)
	render(): JSX.Element;
	// (undocumented)
	state: FilmstripState;
}

// @public (undocumented)
export interface FilmstripItem {
	// (undocumented)
	readonly actions?: Array<CardAction>;
	// (undocumented)
	readonly identifier: Identifier;
	// (undocumented)
	readonly onClick?: CardOnClickCallback;
	// (undocumented)
	readonly onMouseEnter?: (result: CardEvent) => void;
	// (undocumented)
	readonly selectable?: boolean;
	// (undocumented)
	readonly selected?: boolean;
	// (undocumented)
	readonly shouldEnableDownloadButton?: boolean;
}

// @public (undocumented)
export type FilmstripProps = {
	items: FilmstripItem[];
	shouldOpenMediaViewer?: boolean;
	mediaClientConfig?: MediaClientConfig;
	testId?: string;
	featureFlags?: MediaFeatureFlags;
};

// @public (undocumented)
export interface FilmstripState {
	// (undocumented)
	animate: boolean;
	// (undocumented)
	offset: number;
}

// @public (undocumented)
export class FilmstripView extends React_2.Component<FilmstripViewProps, FilmstripViewState> {
	constructor(props: FilmstripViewProps);
	// (undocumented)
	bufferElement?: HTMLElement;
	// (undocumented)
	get canGoLeft(): boolean;
	// (undocumented)
	get canGoRight(): boolean;
	// (undocumented)
	childOffsets: ChildOffset[];
	// (undocumented)
	componentDidMount(): void;
	// (undocumented)
	componentDidUpdate(): void;
	// (undocumented)
	componentWillUnmount(): void;
	// (undocumented)
	static defaultProps: Partial<FilmstripViewProps>;
	// (undocumented)
	getClosestForLeft(offset: number): number;
	// (undocumented)
	getClosestForRight(offset: number): number;
	// (undocumented)
	handleBufferElementChange: (bufferElement: HTMLUListElement) => void;
	// (undocumented)
	handleLeftClick: (event: MouseEvent_2<HTMLDivElement, any>) => void;
	// (undocumented)
	handleMutation: (mutationList: MutationRecord[]) => void;
	// (undocumented)
	handleRightClick: (event: MouseEvent_2<HTMLDivElement, any>) => void;
	// (undocumented)
	handleScroll: (event: WheelEvent_2<HTMLDivElement>) => void;
	// (undocumented)
	handleSizeChange: () => void;
	// (undocumented)
	handleTouchEnd: (event: React_2.TouchEvent) => void;
	// (undocumented)
	handleTouchMove: (event: React_2.TouchEvent) => void;
	// (undocumented)
	handleTouchStart: (event: React_2.TouchEvent) => void;
	// (undocumented)
	handleWindowElementChange: (windowElement: HTMLDivElement) => void;
	// (undocumented)
	initMutationObserver(): void;
	get maxOffset(): number;
	// (undocumented)
	get minOffset(): number;
	// (undocumented)
	mutationObserver?: MutationObserver;
	// (undocumented)
	get offset(): number;
	// (undocumented)
	previousOffset: number;
	// (undocumented)
	render(): JSX.Element;
	// (undocumented)
	renderLeftArrow(): JSX.Element | null;
	// (undocumented)
	renderRightArrow(): JSX.Element | null;
	// (undocumented)
	state: {
		bufferWidth: number;
		windowWidth: number;
		touchMoveStartPosition: number;
		isTouchMoveInProgress: boolean;
	};
	// (undocumented)
	get transitionDuration(): number;
	// (undocumented)
	triggerScrollEvent(): void;
	// (undocumented)
	windowElement?: HTMLElement;
}

// @public (undocumented)
export interface FilmstripViewProps {
	animate?: boolean;
	children?: ReactNode;
	offset?: number;
	onScroll?: (event: ScrollEvent) => void;
	onSize?: (event: SizeEvent) => void;
	testId?: string;
}

// @public (undocumented)
export interface FilmstripViewState {
	// (undocumented)
	bufferWidth: number;
	// (undocumented)
	isTouchMoveInProgress: boolean;
	// (undocumented)
	touchMoveStartPosition: number;
	// (undocumented)
	windowWidth: number;
}

// @public (undocumented)
export const LeftArrow: React_2.SFC<OnClick>;

// @public (undocumented)
export const mediaFilmstripItemDOMSelector: (offset: number) => string;

// @public (undocumented)
export const MUTATION_CONFIG: {
	attributes: boolean;
	childList: boolean;
	subtree: boolean;
	characterData: boolean;
};

// @public (undocumented)
type OnClick = {
	onClick: (event: MouseEvent_2<HTMLDivElement>) => void;
};

// @public (undocumented)
export const RightArrow: React_2.SFC<OnClick>;

// @public (undocumented)
export interface ScrollEvent {
	// (undocumented)
	animate: boolean;
	// (undocumented)
	direction: 'left' | 'right';
	// (undocumented)
	offset: number;
}

// @public (undocumented)
export interface SizeEvent {
	// (undocumented)
	maxOffset: number;
	// (undocumented)
	minOffset: number;
	// (undocumented)
	offset: number;
	// (undocumented)
	offsets: ChildOffset[];
	// (undocumented)
	width: number;
}

// (No @packageDocumentation comment for this package)
```

<!--SECTION END: Main Entry Types-->

### Peer Dependencies

<!--SECTION START: Peer Dependencies-->

```json
{
	"@atlaskit/media-core": "^34.1.2",
	"@emotion/react": "^11.7.1",
	"react": "^16.8.0"
}
```

<!--SECTION END: Peer Dependencies-->