---
title: "VariableItemHelper | Customer's Canvas On-Premises"
canonical: "https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms/VariableItemHelper/"
---

# VariableItemHelper

> [`VariableItemHelper`](#variableitemhelper)

## Classes

### VariableItemHelper

#### Constructors

##### Constructor

```ts
new VariableItemHelper(
   productHandler, 
   canvas, 
   eventManager): VariableItemHelper;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `productHandler` | [`ProductHandler`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms/ProductHandler.md#producthandler) |
| `canvas` | [`Canvas`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms/Canvas-1.md#canvas) |
| `eventManager` | [`EventManager`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms/EventManager.md#eventmanager) |

###### Returns

#### Properties

##### maskSymbol

```ts
maskSymbol: string = "%";
```

#### Methods

##### createNewItemName()

```ts
createNewItemName(item, newRealName): string;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `item` | `Item` |
| `newRealName` | `string` |

###### Returns

`string`

##### getRealItemName()

```ts
getRealItemName(item): string;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `item` | `Item` |

###### Returns

`string`

##### getVariableItemDisplayName()

```ts
getVariableItemDisplayName(name): string;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `name` | `string` |

###### Returns

`string`

##### initVariableItem()

```ts
initVariableItem(item): void;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `item` | `BaseItem` |

###### Returns

`void`

##### initVariableItems()

```ts
initVariableItems(product): void;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `product` | `Product` |

###### Returns

`void`

##### setVariableName()

```ts
setVariableName(
   item, 
   name, 
   supressUpdate?): void;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `item` | `Item` |
| `name` | `string` |
| `supressUpdate?` | `boolean` |

###### Returns

`void`

##### setVariableValue()

```ts
setVariableValue(
   item, 
   value, 
   supressUpdate?): void;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `item` | `Item` |
| `value` | `boolean` |
| `supressUpdate?` | `boolean` |

###### Returns

`void`

##### setVariableValues()

```ts
setVariableValues(items, value): void;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `items` | `Item`[] |
| `value` | `boolean` |

###### Returns

`void`

##### getInterpolationVariables()

```ts
static getInterpolationVariables(textItem): IInterpolationPlaceholderVariable[];
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `textItem` | `BaseTextItem` |

###### Returns

[`IInterpolationPlaceholderVariable`](#iinterpolationplaceholdervariable)[]

##### getVariablesFromBarcodeItem()

```ts
static getVariablesFromBarcodeItem(item, ignoreIsVariableMarker?): IBarcodeVariable[];
```

###### Parameters

| Parameter | Type | Default value |
| ------ | ------ | ------ |
| `item` | `BarcodeItem` | `undefined` |
| `ignoreIsVariableMarker` | `boolean` | `false` |

###### Returns

[`IBarcodeVariable`](#ibarcodevariable)[]

##### getVariablesFromEllipseItem()

```ts
static getVariablesFromEllipseItem(item): IVariable[];
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `item` | `EllipseItem` |

###### Returns

[`IVariable`](#ivariable)[]

##### getVariablesFromGroupItem()

```ts
static getVariablesFromGroupItem(item): IVariable[];
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `item` | `GroupItem` |

###### Returns

[`IVariable`](#ivariable)[]

##### getVariablesFromImageItem()

```ts
static getVariablesFromImageItem(item): IVariable[];
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `item` | `ImageItem` |

###### Returns

[`IVariable`](#ivariable)[]

##### getVariablesFromItems()

```ts
static getVariablesFromItems(items): IVariable[];
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `items` | `BaseItem`[] |

###### Returns

[`IVariable`](#ivariable)[]

##### getVariablesFromLayoutItem()

```ts
static getVariablesFromLayoutItem(item): IVariable[];
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `item` | `LayoutItem` |

###### Returns

[`IVariable`](#ivariable)[]

##### getVariablesFromPlaceholderItem()

```ts
static getVariablesFromPlaceholderItem(item): IVariable[];
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `item` | `PlaceholderItem` |

###### Returns

[`IVariable`](#ivariable)[]

##### getVariablesFromRectangleItem()

```ts
static getVariablesFromRectangleItem(item): IVariable[];
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `item` | `RectangleItem` |

###### Returns

[`IVariable`](#ivariable)[]

##### getVariablesFromShapeItem()

```ts
static getVariablesFromShapeItem(item): IVariable[];
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `item` | `ShapeItem` |

###### Returns

[`IVariable`](#ivariable)[]

##### getVariablesFromTextItem()

```ts
static getVariablesFromTextItem(item): IVariable[];
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `item` | `BaseTextItem` |

###### Returns

[`IVariable`](#ivariable)[]

##### isInStringPlacehodler()

```ts
static isInStringPlacehodler(item): boolean;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `item` | `Item` |

###### Returns

`boolean`

## Interfaces

### IBarcodeVariable

#### Extends

- [`IVariable`](#ivariable)

#### Properties

##### barcodeFormat

```ts
barcodeFormat: BarcodeFormat;
```

##### barcodeSubType

```ts
barcodeSubType: BarcodeSubType;
```

##### name

```ts
name: string;
```

###### Inherited from

[`IVariable`](#ivariable).[`name`](#name-2)

##### type

```ts
type: "Barcode" | "BarcodePlaceholder";
```

###### Overrides

[`IVariable`](#ivariable).[`type`](#type-2)

##### value

```ts
value: string;
```

###### Inherited from

[`IVariable`](#ivariable).[`value`](#value-2)

***

### IInterpolationPlaceholderVariable

#### Extends

- [`IVariable`](#ivariable)

#### Properties

##### mask

```ts
mask: string;
```

##### name

```ts
name: string;
```

###### Inherited from

[`IVariable`](#ivariable).[`name`](#name-2)

##### type

```ts
type: 
  | "Barcode"
  | "BarcodePlaceholder"
  | "Image"
  | "ImagePlaceholder"
  | "Text"
  | "InString";
```

###### Inherited from

[`IVariable`](#ivariable).[`type`](#type-2)

##### value

```ts
value: string;
```

###### Inherited from

[`IVariable`](#ivariable).[`value`](#value-2)

##### values

```ts
values: string[];
```

***

### IVariable

#### Extended by

- [`IBarcodeVariable`](#ibarcodevariable)
- [`IInterpolationPlaceholderVariable`](#iinterpolationplaceholdervariable)

#### Properties

##### name

```ts
name: string;
```

##### type

```ts
type: 
  | "Barcode"
  | "BarcodePlaceholder"
  | "Image"
  | "ImagePlaceholder"
  | "Text"
  | "InString";
```

##### value

```ts
value: string;
```