# StatusBarSettings

## Content

# Type Alias: StatusBarSettings

```ts
type StatusBarSettings = object;
```

## Properties

### gridSizeEditor

```ts
gridSizeEditor: object;
```

Specifies whether **Grid Size** editor needs to be shown

#### visible

```ts
visible: boolean;
```

#### Examples

```javascript
// ESM usage
import { arWebDesigner } from './web-designer.js';
arWebDesigner.create('#ar-web-designer', {
   statusBar: {
       gridSizeEditor: {
           visible: true
       }
   }
});
```

```javascript
// UMD usage
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
   statusBar: {
       gridSizeEditor: {
           visible: true
       }
   }
});
```

```typescript
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
   statusBar: {
       gridSizeEditor: {
           visible: true
       }
   }
});
```

#### Default

```ts
{ visible: true }
```

***

### propertiesModeButton

```ts
propertiesModeButton: object;
```

Specifies whether **Properties Mode** dropdown needs to be shown

#### visible

```ts
visible: boolean;
```

#### Examples

```javascript
// ESM usage
import { arWebDesigner } from './web-designer.js';
arWebDesigner.create('#ar-web-designer', {
   statusBar: {
       propertiesModeButton: {
           visible: true
       }
   }
});
```

```javascript
// UMD usage
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
   statusBar: {
       propertiesModeButton: {
           visible: true
       }
   }
});
```

```typescript
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
   statusBar: {
       propertiesModeButton: {
           visible: true
       }
   }
});
```

#### Default

```ts
{ visible: true }
```

***

### rulersButton

```ts
rulersButton: object;
```

Specifies whether **Show Rulers** toggle needs to be shown

#### visible

```ts
visible: boolean;
```

#### Examples

```javascript
// ESM usage
import { arWebDesigner } from './web-designer.js';
arWebDesigner.create('#ar-web-designer', {
   statusBar: {
       rulersButton: {
           visible: true
       }
   }
});
```

```javascript
// UMD usage
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
   statusBar: {
       rulersButton: {
           visible: true
       }
   }
});
```

```typescript
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
   statusBar: {
       rulersButton: {
           visible: true
       }
   }
});
```

#### Default

```ts
{ visible: true }
```

***

### toggleGridButton

```ts
toggleGridButton: object;
```

Specifies whether **Show Grid** toggle needs to be shown

#### visible

```ts
visible: boolean;
```

#### Examples

```javascript
// ESM usage
import { arWebDesigner } from './web-designer.js';
arWebDesigner.create('#ar-web-designer', {
   statusBar: {
       toggleGridButton: {
           visible: true
       }
   }
});
```

```javascript
// UMD usage
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
   statusBar: {
       toggleGridButton: {
           visible: true
       }
   }
});
```

```typescript
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
   statusBar: {
       toggleGridButton: {
           visible: true
       }
   }
});
```

#### Default

```ts
{ visible: true }
```

***

### toggleUnitsButton

```ts
toggleUnitsButton: object;
```

Specifies whether **Units Button** button needs to be shown

#### visible

```ts
visible: boolean;
```

#### Examples

```javascript
// ESM usage
import { arWebDesigner } from './web-designer.js';
arWebDesigner.create('#ar-web-designer', {
   statusBar: {
       toggleUnitsButton: {
           visible: true
       }
   }
});
```

```javascript
// UMD usage
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
   statusBar: {
       toggleUnitsButton: {
           visible: true
       }
   }
});
```

```typescript
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
   statusBar: {
       toggleUnitsButton: {
           visible: true
       }
   }
});
```

#### Default

```ts
{ visible: true }
```

***

### visible

```ts
visible: boolean;
```

Specifies whether **Status Bar** needs to be shown

#### Examples

```javascript
// ESM usage
import { arWebDesigner } from './web-designer.js';
arWebDesigner.create('#ar-web-designer', {
  statusBar: { visible: false }
});
```

```javascript
// UMD usage
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
  statusBar: { visible: false }
});
```

```typescript
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
  statusBar: { visible: false }
});
```

#### Default

```ts
true
```