### File

`packages/components/eui-file-upload/file-preview/file-preview.component.ts`

### Description

Internal class used by `eui-file-upload` to display the files to be uploaded.

### Implements

`OnInit` `AfterViewInit`

### Metadata

changeDetection | `ChangeDetectionStrategy.OnPush`
encapsulation | `ViewEncapsulation.None`
selector | `eui-file-preview`
imports | `NgTemplateOutlet` `EUI_BUTTON` `EUI_ICON` `EUI_LABEL` `EuiFileSizePipe`
templateUrl | `./file-preview.component.html`

### Index

###### Properties

- Public fileExtension
- Public icon
- Public isLoading
- Public previewData
- templates
- Public typeFromFileExtension
- Public url

###### Methods

- Public onItemClick
- Public onRemoveFromList

###### Inputs

- file
- hasPreview
- hasPreviewAsIcon
- hasPreviewAsImage
- index
- isFilenameDisplayed
- isFileObject
- isFilesizeDisplayed
- isFiletypeDisplayed
- isItemsClickable
- previewAsIconConfig
- uploadedFileTemplate

###### Outputs

- itemClick
- removeFromList

### Inputs

file
Type : `Blob | EuiUploadedFileInterface | any`
The file to use. Will be a `Blob` for a file to be uploaded, `EuiUploadedFileInterface` for an initial file.

hasPreview
Type : `boolean`
Default value : `true`
Whether a preview, image or icon, is displayed for a file to upload.

hasPreviewAsIcon
Type : `boolean`
Default value : `false`
Whether a preview is displayed as a file format icon.

hasPreviewAsImage
Type : `boolean`
Default value : `true`
Whether a preview is displayed as image.

index
Type : `number`
Index of the file in the list.

isFilenameDisplayed
Type : `boolean`
Default value : `true`
Whether the filename is displayed.

isFileObject
Type : `boolean`
Default value : `false`
Whether the file is `File` or has been provided by the user as initial value.

isFilesizeDisplayed
Type : `boolean`
Default value : `true`
Whether the filesize is displayed.

isFiletypeDisplayed
Type : `boolean`
Default value : `true`
Whether the file type is displayed.

isItemsClickable
Type : `boolean`
Default value : `false`
Whether items can be clicked. `itemClick` event is emitted.

previewAsIconConfig
Type : `{ avi: string; html: string; htm: string; js: string; json: string; mp3: string; mp4: string; pdf: string; png: string; svg: string; txt: string; xml: string; jpeg: string; jpg: string; zip: string; doc: string; ... 5 more ...; rtf: string; }`

Default value : `{ avi: 'eui-file-video:eui-file', html: 'eui-file-html:eui-file', htm: 'eui-file-code:eui-file', js: 'eui-file-code:eui-file', json: 'eui-file-code:eui-file', mp3: 'eui-file-audio:eui-file', mp4: 'eui-file-video:eui-file', pdf: 'eui-file-pdf:eui-file', png: 'eui-file-png:eui-file', svg: 'eui-file-svg:eui-file', txt: 'eui-file-txt:eui-file', xml: 'eui-file-code:eui-file', jpeg: 'eui-file-jpg:eui-file', jpg: 'eui-file-jpg:eui-file', zip: 'eui-file-archive:eui-file', doc: 'eui-file-word:eui-file', docx: 'eui-file-word:eui-file', xls: 'eui-file-xls:eui-file', xlsx: 'eui-file-xls:eui-file', ppt: 'eui-file-ppt:eui-file', csv: 'eui-file-csv:eui-file', rtf: 'eui-file-txt:eui-file', }`

Object matching extension and icon.

uploadedFileTemplate
Type : `TemplateRef<literal type>`
Template to use in the list of files.

### Outputs

itemClick
Type : `EventEmitter`
Event emitted when a chosen file to upload is clicked.

removeFromList
Type : `EventEmitter`
Event emitted when the remove button is clicked.

### Methods

Public onItemClick
`onItemClick(e: Event)`

Click item handler.

Parameters :

Name | Type | Optional | Description
e | `Event` | No | The item clicked.

Returns : `void`

Public onRemoveFromList
`onRemoveFromList()`
Remove from the list handler. Returns : `void`

### Properties

Public fileExtension
Type : `string`

Public icon
Type : `string`

Public isLoading
Type : `unknown`
Default value : `false`

Public previewData
Type : `literal type`

templates
Type : `QueryList<EuiTemplateDirective>`
Decorators : `@ContentChildren(EuiTemplateDirective)`

Public typeFromFileExtension
Type : `string`
Default value : `null`

Public url
Type : `string`

# results matching ""

# No results matching ""