# DsDataViewer

## Content

# Class: DsDataViewer

Document Solutions Data Viewer control.

## Constructors

### Constructor

```ts
new DsDataViewer(element): DsDataViewer;
```

Document Solutions Data Viewer constructor.

#### Parameters

##### element

`string` \| `HTMLElement`

root container element or selector pattern used to select the root container element.

#### Returns

`DsDataViewer`

## Properties

### LicenseKey

```ts
static LicenseKey: string;
```

Product license key.

#### Example

```
<script>
 // Add your license
 DsDataViewer.LicenseKey = 'XXX';
 // Add your code
 const viewer = new DsDataViewer("#viewer");
</script>
```

## Accessors

### sidebarLayout

#### Get Signature

```ts
get sidebarLayout(): string[];
```

Get the current sidebar layout information.

##### Example

```javascript
viewer.sidebarLayout
```

##### Returns

`string`[]

#### Set Signature

```ts
set sidebarLayout(sidebarLayout): void;
```

Sets the sidebar layout information and modify layout.
Currently supported: SearchPanel.

##### Example

```javascript
// Open SearchPanel
viewer.sidebarLayout = ['SearchPanel'];
// Clear all sidebars
viewer.sidebarLayout = [''];
// Default sidebar layout
viewer.sidebarLayout = [];
```

##### Parameters

###### sidebarLayout

`string`[]

##### Returns

`void`

***

### toolbarLayout

#### Get Signature

```ts
get toolbarLayout(): DataToolbarLayout;
```

Get the current toolbar layout information.

##### Example

```javascript
viewer.toolbarLayout
```

##### Returns

[`DataToolbarLayout`](../type-aliases/DataToolbarLayout)

#### Set Signature

```ts
set toolbarLayout(buttons): void;
```

Sets the toolbar layout information and modify layout.

##### Example

```javascript
viewer.toolbarLayout = { default: ['open', 'zoom', 'fullscreen', 'theme-change'] }
```

##### Parameters

###### buttons

[`DataToolbarLayout`](../type-aliases/DataToolbarLayout)

The toolbar layout information.

##### Returns

`void`

## Methods

### findControl()

```ts
static findControl(selector): DsDataViewer;
```

Gets the viewer instance using the host element or host element selector

#### Parameters

##### selector

`string` \| `HTMLElement`

#### Returns

`DsDataViewer`

#### Example

```javascript
var viewer = DsDataViewer.findControl("#root");
```

***

### dispose()

```ts
dispose(): void;
```

Use this method to close and release resources occupied by the DsDataViewer.

#### Returns

`void`

***

### getActiveSheet()

```ts
getActiveSheet(): WorkSheet;
```

Fetches the active sheet.

#### Returns

[`WorkSheet`](WorkSheet)

The active sheet instance.

#### Example

```javascript
viewer.getActiveSheet()
```

***

### getSheet()

```ts
getSheet(index): WorkSheet;
```

Fetches the specified sheet based on the index.

#### Parameters

##### index

`number`

The index of the sheet to return.

#### Returns

[`WorkSheet`](WorkSheet)

The specified sheet.

#### Example

```javascript
viewer.getSheet(0)
```

***

### getSheetFromName()

```ts
getSheetFromName(name): WorkSheet;
```

Fetches the sheet with the specified name.

#### Parameters

##### name

`string`

The sheet name.

#### Returns

[`WorkSheet`](WorkSheet)

The sheet with the specified name.

#### Example

```javascript
viewer.getSheetFromName("Sheet1")
```

***

### openFile()

```ts
openFile(
   file, 
   fileType, 
   openOptions?): void;
```

Open data file.

#### Parameters

##### file

`Blob`

The data file.

##### fileType

[`FileType`](../enumerations/FileType)

The type of the imported data file.

##### openOptions?

  \| [`XlsxOpenOptions`](../type-aliases/XlsxOpenOptions)
  \| [`SSJsonOpenOptions`](../type-aliases/SSJsonOpenOptions)
  \| [`CsvOpenOptions`](../type-aliases/CsvOpenOptions)
  \| [`SjsOpenOptions`](../type-aliases/SjsOpenOptions)

The options for imported data file.

#### Returns

`void`

#### Example

```javascript
viewer.openFile("Documents/HelloWorld.xlsx", FileType.XLSX, {loadHiddenSheets: true});
```

***

### showSidebar()

```ts
showSidebar(show): void;
```

Set the visibility of the sidebar.

#### Parameters

##### show

`boolean`

The visibility of the sidebar.

#### Returns

`void`

#### Example

```javascript
viewer.showSidebar(true)
```
