# Interface: DocumentResultViewToolbarButtonsConfig

[Mobile Document Scanner API Reference](../index.md) / DocumentResultViewToolbarButtonsConfig

# Interface: DocumentResultViewToolbarButtonsConfig

Defined in: [src/views/DocumentResultView.ts:71](https://github.com/Dynamsoft/document-scanner-javascript/blob/main/src/views/DocumentResultView.ts#L71)

Configuration interface for customizing toolbar buttons in the [DocumentResultView](../classes/DocumentResultView.md).

## Remarks

This interface allows you to customize the appearance and behavior of the toolbar buttons displayed in the [DocumentResultView](../classes/DocumentResultView.md). Each button can be configured using a [ToolbarButtonConfig](../type-aliases/ToolbarButtonConfig.md) object to modify its icon, label, CSS class, or visibility.

The behaviors described for each button below are the default behaviors. You can override the default behavior by providing a custom [ToolbarButton.onClick](ToolbarButton.md#onclick) handler through the [ToolbarButtonConfig](../type-aliases/ToolbarButtonConfig.md).

## Examples

Customize button appearance:
```javascript
const documentScanner = new Dynamsoft.DocumentScanner({
    license: "YOUR_LICENSE_KEY_HERE",
    resultViewConfig: {
        toolbarButtonsConfig: {
            retake: {
                isHidden: true
            },
            share: {
                icon: "path/to/new_icon.png",
                label: "Custom Label"
            }
        }
    }
});
```

Override button behavior with custom onClick handler:
```javascript
const documentScanner = new Dynamsoft.DocumentScanner({
    license: "YOUR_LICENSE_KEY_HERE",
    resultViewConfig: {
        toolbarButtonsConfig: {
            done: {
                label: "Save",
                onClick: async () => {
                    // Custom save logic
                    await saveToServer(documentScanner.result);
                    console.log("Document saved!");
                }
            },
            share: {
                onClick: async () => {
                    // Custom share logic
                    await sendViaEmail(documentScanner.result);
                }
            }
        }
    }
});
```

## Properties

### correct?

> `optional` **correct?**: `Partial`\<`Pick`\<[`ToolbarButton`](ToolbarButton.md), `"icon"` \| `"label"` \| `"className"` \| `"isHidden"`\>\>

Defined in: [src/views/DocumentResultView.ts:83](https://github.com/Dynamsoft/document-scanner-javascript/blob/main/src/views/DocumentResultView.ts#L83)

Configuration for the correct button. Default behavior: enters the [DocumentCorrectionView](../classes/DocumentNormalizerView.md) to adjust document boundaries.

***

### done?

> `optional` **done?**: `Partial`\<`Pick`\<[`ToolbarButton`](ToolbarButton.md), `"icon"` \| `"label"` \| `"className"` \| `"isHidden"`\>\>

Defined in: [src/views/DocumentResultView.ts:110](https://github.com/Dynamsoft/document-scanner-javascript/blob/main/src/views/DocumentResultView.ts#L110)

Configuration for the done button. Default behavior: completes the scanning workflow.

#### Remarks

In continuous scanning mode ([DocumentScannerConfig.enableContinuousScanning](DocumentScannerConfig.md#enablecontinuousscanning)), a separate floating "Scan More" button keeps the current scan and loops back to the [DocumentScannerView](../classes/DocumentScannerView.md) for the next capture.

***

### filter?

> `optional` **filter?**: `Partial`\<`Pick`\<[`ToolbarButton`](ToolbarButton.md), `"icon"` \| `"label"` \| `"className"` \| `"isHidden"`\>\>

Defined in: [src/views/DocumentResultView.ts:129](https://github.com/Dynamsoft/document-scanner-javascript/blob/main/src/views/DocumentResultView.ts#L129)

Configuration for the filter button. Default behavior: reveal drop-up menu with the following filters:

1. Original
2. Grayscale
3. Black & White
4. Sepia
5. Inverted

***

### retake?

> `optional` **retake?**: `Partial`\<`Pick`\<[`ToolbarButton`](ToolbarButton.md), `"icon"` \| `"label"` \| `"className"` \| `"isHidden"`\>\>

Defined in: [src/views/DocumentResultView.ts:77](https://github.com/Dynamsoft/document-scanner-javascript/blob/main/src/views/DocumentResultView.ts#L77)

Configuration for the retake button. Default behavior: returns to the [DocumentScannerView](../classes/DocumentScannerView.md) to capture a new image.

***

### rotate?

> `optional` **rotate?**: `Partial`\<`Pick`\<[`ToolbarButton`](ToolbarButton.md), `"icon"` \| `"label"` \| `"className"` \| `"isHidden"`\>\>

Defined in: [src/views/DocumentResultView.ts:117](https://github.com/Dynamsoft/document-scanner-javascript/blob/main/src/views/DocumentResultView.ts#L117)

Configuration for the done button. Default behavior: rotate the image 90 degrees clockwise.

***

### share?

> `optional` **share?**: `Partial`\<`Pick`\<[`ToolbarButton`](ToolbarButton.md), `"icon"` \| `"label"` \| `"className"` \| `"isHidden"`\>\>

Defined in: [src/views/DocumentResultView.ts:92](https://github.com/Dynamsoft/document-scanner-javascript/blob/main/src/views/DocumentResultView.ts#L92)

Configuration for the share button. Default behavior: shares or downloads the scanned document.

#### Remarks

On mobile devices with Web Share API support, this button triggers the native share dialog. On desktop or devices without share support, it downloads the image instead.

***

### upload?

> `optional` **upload?**: `Partial`\<`Pick`\<[`ToolbarButton`](ToolbarButton.md), `"icon"` \| `"label"` \| `"className"` \| `"isHidden"`\>\>

Defined in: [src/views/DocumentResultView.ts:101](https://github.com/Dynamsoft/document-scanner-javascript/blob/main/src/views/DocumentResultView.ts#L101)

Configuration for the upload button. Default behavior: triggers the [DocumentResultViewConfig.onUpload](DocumentResultViewConfig.md#onupload) callback.

#### Remarks

This button is only visible when [DocumentResultViewConfig.onUpload](DocumentResultViewConfig.md#onupload) is defined.