---
title: "IStateSurfaces Interface"
canonical: https://customerscanvas.com/docs/cc6/customerscanvas.iframeapi.objectmodel.istatesurfaces.htm
archived: true
applies_to:
  - product: "Customer's Canvas On-Premises"
  - product: "Design Editor"
    versions: ["6.15.0", "6.x (may differ)"]
---

**You’re viewing outdated documentation.** [View the latest Customer’s Canvas On-Premises documentation](https://customerscanvas.com/docs/on-premises/).

# IStateSurfaces Interface

**Applies to:** Customer's Canvas On-Premises; Design Editor 6.15.0, 6.x (may differ) · **Archived documentation**
 
A structure holding a state file name and an array of surface names.
  
 - example
     - ```
editor.getProduct()
    // When we get the product.
    .then(function(product) {
        // Add the first three pages to the product.
        product.addSurfaces(
            { 
                stateId: "3c040958-bfa8-4a3e-b3af-cff9257e7fa1",
                surfaces: ["0", "surface_1", "surface_2"]
            }
        )
        // If there was an error while adding pages to the product.
        .catch(function (error) {
            console.error("Adding surfaces failed with exception: ", error);
        });
    });
```
 
## Properties
 
### stateId
 
stateId: string

The name of a state file.
 
### Optional surfaces
 
surfaces: string []

An array of surface names or indexes starting from `0`. When you skip this array, all pages of the state file are added to a product.