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

# ItemUtils

> [`ItemUtils`](#itemutils)

## Enumerations

### UpdatePhase

#### Enumeration Members

| Enumeration Member | Value |
| ------ | ------ |
|  `Final` | `1` |
|  `InProgress` | `0` |

## Classes

### ItemUtils

#### Constructors

##### Constructor

```ts
new ItemUtils(): ItemUtils;
```

###### Returns

#### Accessors

##### designAtomsApiClient

###### Set Signature

```ts
set static designAtomsApiClient(designAtomsApiClient): void;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `designAtomsApiClient` | [`IDesignAtomsApiClient`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms/IDesignAtomsApiClient.md#idesignatomsapiclient) |

###### Returns

`void`

#### Methods

##### alignHandlerToRect()

```ts
static alignHandlerToRect(
   itemHandler, 
   rectangle, 
   item): void;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `itemHandler` | [`BaseRectangleItemHandler`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms/BaseRectangleItemHandler.md#baserectangleitemhandler) |
| `rectangle` | `RotatedRectangleF` |
| `item` | `Item` |

###### Returns

`void`

##### allowManipulate()

```ts
static allowManipulate(item): any;
```

###### Parameters

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

###### Returns

`any`

##### allowMoveHorizontal()

```ts
static allowMoveHorizontal(item): any;
```

###### Parameters

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

###### Returns

`any`

##### allowMoveVertical()

```ts
static allowMoveVertical(item): any;
```

###### Parameters

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

###### Returns

`any`

##### applyGroupItemsChanges()

```ts
static applyGroupItemsChanges(
   groupItems, 
   targetItems, 
   addToTarget, 
   options): void;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `groupItems` | [`IChangedGroupItem`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms/Interfaces-3.md#ichangedgroupitem)[] |
| `targetItems` | `Item`[] |
| `addToTarget` | (`item`) => `void` |
| `options` | [`IApplyGroupChangesOptions`](#iapplygroupchangesoptions) |

###### Returns

`void`

##### applyOverlayEffect()

```ts
static applyOverlayEffect(item, overlayEffect): void;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `item` | `any` |
| `overlayEffect` | `OverlayEffect` |

###### Returns

`void`

##### changeItemsContent()

```ts
static changeItemsContent(
   product, 
   productHandler, 
   commandManager, 
   oldItems, 
   newItems, 
   replaceAll): void;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `product` | `Product` |
| `productHandler` | [`ProductHandler`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms/ProductHandler.md#producthandler) |
| `commandManager` | [`ICommandManager`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms/ICommandManager.md#icommandmanager) |
| `oldItems` | `Item`[] |
| `newItems` | `Item`[] |
| `replaceAll` | `boolean` |

###### Returns

`void`

##### clearImageContent()

```ts
static clearImageContent(placeHolder): void;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `placeHolder` | `PlaceholderItem` |

###### Returns

`void`

##### createCloneName()

```ts
static createCloneName(
   item, 
   variableItemHelper, 
   productHandler): string;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `item` | `any` |
| `variableItemHelper` | [`VariableItemHelper`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms/VariableItemHelper.md#variableitemhelper) |
| `productHandler` | [`ProductHandler`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms/ProductHandler.md#producthandler) |

###### Returns

`string`

##### createImageContentForPlaceholder()

```ts
static createImageContentForPlaceholder(
   placeholder, 
   metadata, 
   productHandler, 
   hiResOutputDpi?): any;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `placeholder` | `PlaceholderItem` |
| `metadata` | `any` |
| `productHandler` | [`ProductHandler`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms/ProductHandler.md#producthandler) |
| `hiResOutputDpi?` | `number` |

###### Returns

`any`

##### getAllowChangeContent()

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

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `item` | `any` |

###### Returns

`boolean`

##### getAllowTextFormatting()

```ts
static getAllowTextFormatting(textItem?, defaultValue?): any;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `textItem?` | `BaseTextItem` |
| `defaultValue?` | `boolean` |

###### Returns

`any`

##### getBarcodeItem()

```ts
static getBarcodeItem(item): BarcodeItem;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `item` | `any` |

###### Returns

`BarcodeItem`

##### getBarcodePermissions()

```ts
static getBarcodePermissions(item): BarcodePermissions;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `item` | `any` |

###### Returns

`BarcodePermissions`

##### getColorPalette()

```ts
static getColorPalette(item, colorPreviewService): Promise<IColorData[]>;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `item` | `BaseTextItem` |
| `colorPreviewService` | [`IColorPreviewService`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms/IColorPreviewService.md#icolorpreviewservice) |

###### Returns

[`Promise`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms/finally.md#promise)\<[IColorData](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-text/IColorData.md)[]\>

##### getContentEffect()

```ts
static getContentEffect(item): ImageEffect;
```

###### Parameters

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

###### Returns

`ImageEffect`

##### getEmptyPlaceholdersFromProduct()

```ts
static getEmptyPlaceholdersFromProduct(product, skipLinked?): PlaceholderItem[];
```

###### Parameters

| Parameter | Type | Default value |
| ------ | ------ | ------ |
| `product` | `Product` | `undefined` |
| `skipLinked` | `boolean` | `false` |

###### Returns

`PlaceholderItem`[]

##### getImageItem()

```ts
static getImageItem(item): ImageItem;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `item` | `any` |

###### Returns

`ImageItem`

##### getImageMetaDataFromDesignImage()

```ts
static getImageMetaDataFromDesignImage(appDomainUrl?, designImageName): Promise<any>;
```

###### Parameters

| Parameter | Type | Default value |
| ------ | ------ | ------ |
| `appDomainUrl` | `string` | `undefined` |
| `designImageName` | `string` | `undefined` |

###### Returns

[`Promise`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms/finally.md#promise)\<`any`\>

##### getImageMetaDataFromFile()

```ts
static getImageMetaDataFromFile(
   appDomainUrl?, 
   filePath, 
userId?): Promise<any>;
```

###### Parameters

| Parameter | Type | Default value |
| ------ | ------ | ------ |
| `appDomainUrl` | `string` | `undefined` |
| `filePath` | `string` | `undefined` |
| `userId` | `string` | `null` |

###### Returns

[`Promise`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms/finally.md#promise)\<`any`\>

##### getImageMetadataFromRemoteFile()

```ts
static getImageMetadataFromRemoteFile(appDomainUrl?, url): Promise<any>;
```

###### Parameters

| Parameter | Type | Default value |
| ------ | ------ | ------ |
| `appDomainUrl` | `string` | `undefined` |
| `url` | `string` | `undefined` |

###### Returns

[`Promise`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms/finally.md#promise)\<`any`\>

##### getImagePermissions()

```ts
static getImagePermissions(item): ImagePermissions;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `item` | `any` |

###### Returns

`ImagePermissions`

##### getImageSizeInPoints()

```ts
static getImageSizeInPoints(source): object;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `source` | `ImageSource` |

###### Returns

`object`

###### height

```ts
height: any;
```

###### width

```ts
width: any;
```

##### getImageUrlFromImageMetadata()

```ts
static getImageUrlFromImageMetadata(
   imageMetadata, 
   canvas, 
   width?, 
   height?, 
   keepProportions?): string;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `imageMetadata` | `ImageMetaData` |
| `canvas` | [`Canvas`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms/Canvas-1.md#canvas) |
| `width?` | `number` |
| `height?` | `number` |
| `keepProportions?` | `boolean` |

###### Returns

`string`

##### getItemBoundsForViolationCheck()

```ts
static getItemBoundsForViolationCheck(handler): RectangleF;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `handler` | [`ItemHandler`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms/ItemHandler.md#itemhandler) |

###### Returns

`RectangleF`

##### getMaxFontSize()

```ts
static getMaxFontSize(textItem): any;
```

###### Parameters

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

###### Returns

`any`

##### getTextFromRichTextItem()

```ts
static getTextFromRichTextItem(item): any;
```

###### Parameters

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

###### Returns

`any`

##### isBgContainerItem()

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

###### Parameters

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

###### Returns

`boolean`

##### isDataMatrixBarcode()

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

###### Parameters

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

###### Returns

`boolean`

##### isEmptyPlaceholder()

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

###### Parameters

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

###### Returns

`boolean`

##### isFgContainerItem()

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

###### Parameters

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

###### Returns

`boolean`

##### isImage()

```ts
static isImage(item): item is any;
```

###### Parameters

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

###### Returns

`item is any`

##### isLinearBarcode()

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

###### Parameters

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

###### Returns

`boolean`

##### isMultiValueItem()

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

###### Parameters

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

###### Returns

`boolean`

##### isQrCode()

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

###### Parameters

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

###### Returns

`boolean`

##### isRotated()

```ts
static isRotated(item, contentAngle): boolean;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `item` | `Item` |
| `contentAngle` | `number` |

###### Returns

`boolean`

##### isTextItemHandlerReady()

```ts
static isTextItemHandlerReady(item, productHandler): boolean;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `item` | `Item` |
| `productHandler` | [`ProductHandler`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms/ProductHandler.md#producthandler) |

###### Returns

`boolean`

##### isTextType()

```ts
static isTextType(type): any;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `type` | `any` |

###### Returns

`any`

##### isVariableItem()

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

###### Parameters

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

###### Returns

`boolean`

##### positionItemInArea()

```ts
static positionItemInArea(
   productHandler, 
   item, 
   boundsWidth, 
   boundsHeight, 
   ignoreRotate?, 
   targetRegion?, 
   oldCenterPoint?, 
   relativeToPrintArea?): any;
```

###### Parameters

| Parameter | Type | Default value |
| ------ | ------ | ------ |
| `productHandler` | [`ProductHandler`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms/ProductHandler.md#producthandler) | `undefined` |
| `item` | `Item` | `undefined` |
| `boundsWidth` | `number` | `undefined` |
| `boundsHeight` | `number` | `undefined` |
| `ignoreRotate` | `boolean` | `true` |
| `targetRegion` | `RotatedRectangleF` | `null` |
| `oldCenterPoint` | `PointF` | `null` |
| `relativeToPrintArea` | `boolean` | `true` |

###### Returns

`any`

##### promoteImageMetaData()

```ts
static promoteImageMetaData(appDomainUrl?, metaDataList): Promise<void>;
```

###### Parameters

| Parameter | Type | Default value |
| ------ | ------ | ------ |
| `appDomainUrl` | `string` | `undefined` |
| `metaDataList` | `ImageMetaData`[] | `undefined` |

###### Returns

[`Promise`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms/finally.md#promise)\<`void`\>

##### removeDeletedItems()

```ts
static removeDeletedItems(
   targetItems, 
   removedItems, 
   groupItems): void;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `targetItems` | `Item`[] |
| `removedItems` | `Item`[] |
| `groupItems` | [`IChangedGroupItem`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms/Interfaces-3.md#ichangedgroupitem)[] |

###### Returns

`void`

##### rotateItems()

```ts
static rotateItems(
   productHandler, 
   items, 
   rotateCenter, 
   angle): void;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `productHandler` | [`ProductHandler`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms/ProductHandler.md#producthandler) |
| `items` | `Item`[] |
| `rotateCenter` | `PointF` |
| `angle` | `number` |

###### Returns

`void`

##### setOverlayEffectColor()

```ts
static setOverlayEffectColor(item, color): void;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `item` | `any` |
| `color` | `Color` |

###### Returns

`void`

##### updateItems()

```ts
static updateItems(
   items, 
   productHandler, 
   canvas, 
   options?): void;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `items` | `Item`[] |
| `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) |
| `options?` | [`UpdateItemsOptions`](#updateitemsoptions) |

###### Returns

`void`

##### waitForItemsUpdated()

```ts
static waitForItemsUpdated(items, canvas): Promise<void>;
```

###### Parameters

| Parameter | Type |
| ------ | ------ |
| `items` | `Item`[] |
| `canvas` | [`ICanvas`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms/ICanvas.md#icanvas) |

###### Returns

[`Promise`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms/finally.md#promise)\<`void`\>

## Interfaces

### IApplyGroupChangesOptions

#### Properties

##### commandManager

```ts
commandManager: ICommandManager;
```

##### product

```ts
product: Product;
```

##### productHandler

```ts
productHandler: ProductHandler;
```

##### replaceAll

```ts
replaceAll: boolean;
```

##### transformItem

```ts
transformItem: (item) => void;
```

###### Parameters

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

###### Returns

`void`

## Type Aliases

### UpdateItemsOptions

```ts
type UpdateItemsOptions = object;
```

#### Properties

##### addToHistory?

```ts
optional addToHistory?: boolean;
```

##### redraw?

```ts
optional redraw?: boolean;
```

##### updatePhase?

```ts
optional updatePhase?: UpdatePhase;
```