@spiffcommerce/core 23.0.5 → 24.0.1

package/dist/index.d.ts

@@ -1,35 +1,10 @@
-import * as _spiffcommerce_papyrus from '@spiffcommerce/papyrus';
-import { OptionResource, VariantResource, Step, AnyStepData, FrameOffsets, PatternImageData, Region, Workflow, ILayout, LayoutsState, LayoutData, Asset, MaterialResource, AssetType, StepType, AspectType, CommandState, CommandContext, GlobalPropertyConfigurationAspect, GlobalPropertyConfiguration, Theme, SilentStepData, Placeable, StepStorage, CanvasCommand, LayoutState, SerializableStep, FrameStepData, CreateElementCommand, FrameElement, ColorDefinition, IllustrationStepData, IllustrationElement, MaterialStepData, ModelStepData, TextStepData, TextboxElement, TextFillImage, FontData, GroupCommand, PictureStepData, QuestionStepData, ShapeStepData, ModuleStepData, DigitalContentStepData, FrameData as FrameData$1, InformationStepData } from '@spiffcommerce/papyrus';
-export { Animatable, AnyStepData, AspectType, Asset, AssetType, BringForwardCommand, BringToBackCommand, BringToFrontCommand, CanvasCommand, ColorDefinition, ColorProfileProps, CommandContext, CommandState, CreateElementCommand, CreateLayoutCommand, DeleteElementCommand, DigitalContentStepData, FontAlignmentCommand, FontColorCommand, FontSizeCommand, FontSourceCommand, FrameElement, FrameStepData, GroupCommand, ILayout, IllustrationElement, IllustrationStepData, ImageElement, InformationStepData, LayoutData, LayoutElement, LayoutElementFactory, LayoutElementType, LayoutsState, MaterialStepData, ModelStepData, ModuleStepData, MoveCommand, OptionResource, PictureStepData, Placeable, QuestionStepData, ResizeCommand, RotateCommand, SendBackwardsCommand, ShapeStepData, Step, StepAspect, StepAspectType, StepStorage, StepType, TextChangeCommand, TextStepData, TextboxElement, Theme, UnitOfMeasurement, UpdateImageSourceCommand, VariantResource, Workflow, WorkflowPanel, dataUrlFromExternalUrl, determineCorrectFontSizeAndLines, findElement, frameDataCache, generate, generateSVGWithUnknownColors, getAttributesFromArrayBuffer, getAxisAlignedBoundingBox, getFrameData, getSvgElement, loadFont, patternImageDataCache, registerFetchImplementation, registerWindowImplementation, rehydrateSerializedLayout, setCanvasModule, svgToDataUrl } from '@spiffcommerce/papyrus';
-import { ApolloClient, MutationOptions, FetchResult } from '@apollo/client/core';
+import { FunctionComponent, ReactNode } from 'preact/compat';
+import { MutationOptions, FetchResult, ApolloClient } from '@apollo/client/core';
 import { RenderableContextService, RenderableContext, ThreeDPreviewService, ModelContainer } from '@spiffcommerce/preview';
 import * as lodash from 'lodash';
 import { ThemeInstallConfigurationGraphQl } from '@spiffcommerce/theme-bridge';
 import { FuseResult } from 'fuse.js';
-
-declare class OptionService {
-    /**
-     * Allows for retrieving an option, returns the option from a cache if possible.
-     * @param id The option ID to be retrieved.
-     */
-    getOption(id: string): Promise<undefined | OptionResource>;
-    getAssetTileImageForVariant(variant: VariantResource): Promise<string>;
-    getDefaultVariant(option: OptionResource): VariantResource | undefined;
-    /**
-     * Returns the first variant marked as selected. This is used by most steps.
-     */
-    getSelectedVariant: (option: OptionResource | undefined, selectedVariantIds: string[]) => VariantResource | undefined;
-}
-declare const optionService: OptionService;
-
-declare const setBearerAuthenticationToken: (token: string) => void;
-declare class GraphQlManager {
-    private shadowGraphqlClient;
-    constructor();
-    getShadowGraphqlClient(): ApolloClient<any>;
-    private constructShadowGraphqlClient;
-}
-declare const graphQlManager: GraphQlManager;
+import { Font } from 'opentype.js';
 
 /**
  * A renderable scene is a scene that can be displayed to the user. This is based on the workflow state.
@@ -148,6 +123,7 @@ declare class FrameService {
     private offsets;
     private thresholdSettings;
     private forceImageCover?;
+    private initialZoom?;
     private targetElements;
     private imageData?;
     private frameData?;
@@ -164,7 +140,7 @@ declare class FrameService {
     private onZoomChangeListeners;
     private workflowManager?;
     private stepName?;
-    constructor(forceImageCover?: boolean);
+    constructor(forceImageCover?: boolean, initialZoom?: number);
     /**
      * When we want to connect a workflow manager to the state of the image cropper we
      * can pass it to this function. Inside we'll attach any required event listeners.
@@ -297,6 +273,348 @@ interface DesignInputStep {
 interface DesignInputStepData {
 }
 
+interface SVGLayoutProps {
+    configuration: RenderingConfiguration;
+    preserveAspectRatio?: string;
+    outlineArea?: {
+        x?: number;
+        y?: number;
+        width?: number;
+        height?: number;
+        scale?: number;
+        hidden?: boolean;
+    };
+    viewBox?: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    };
+    width: number | string;
+    height: number | string;
+    position?: string;
+    maxWidth?: string;
+    maxHeight?: string;
+    elements: LayoutElement[];
+    backgroundColor?: string;
+    outlineColor?: string;
+    omitBoundClipping?: boolean;
+    borderRadius?: number;
+}
+
+/**
+ * An abstract base class from which to extend all potential element commands. These commands
+ * follow the command design pattern in software development. To learn more about this pattern
+ * take a look at the following link.
+ *
+ * https://sourcemaking.com/design_patterns/command
+ *
+ */
+declare abstract class CanvasCommand {
+    abstract apply(state: LayoutsState): LayoutsState;
+    varying?: boolean;
+    protected oldState?: LayoutsState;
+    undo(): LayoutsState;
+    overrideOldState(state: LayoutsState): void;
+    sequenceId?: string;
+}
+/**
+ * Shifts an element with given ID from its current position to a new position.
+ */
+declare class MoveCommand extends CanvasCommand {
+    private id;
+    private x;
+    private y;
+    constructor(id: string, x: number, y: number);
+    apply(state: LayoutsState): {
+        layouts: {
+            [x: string]: LayoutState;
+        };
+        serializableWorkflow: SerializableWorkflow;
+    };
+}
+/**
+ * Rotates an element to a given angle in degrees.
+ */
+declare class RotateCommand extends CanvasCommand {
+    private id;
+    private angle;
+    constructor(id: string, angle: number);
+    apply(state: LayoutsState): {
+        layouts: {
+            [x: string]: LayoutState;
+        };
+        serializableWorkflow: SerializableWorkflow;
+    };
+}
+/**
+ * Updates the width and height of an element to reflect a new size. Negative values will be
+ * converted to their absolute value. ie. -10 will become 10.
+ */
+declare class ResizeCommand extends CanvasCommand {
+    private id;
+    private width;
+    private height;
+    constructor(id: string, width: number, height: number);
+    apply(state: LayoutsState): {
+        layouts: {
+            [x: string]: LayoutState;
+        };
+        serializableWorkflow: SerializableWorkflow;
+    };
+}
+/**
+ * Applys a list of command objects to the current state, the final state
+ * will be that of all commands applied in the order of left to right.
+ */
+declare class GroupCommand extends CanvasCommand {
+    private commands;
+    constructor(commands: CanvasCommand[]);
+    apply(state: LayoutsState): LayoutsState;
+}
+declare class CreateLayoutCommand extends CanvasCommand {
+    private layout;
+    constructor(layout: ILayout);
+    apply(state: LayoutsState): LayoutsState;
+}
+/**
+ * Add an element to the canvas
+ */
+declare class CreateElementCommand<T extends LayoutElement> extends CanvasCommand {
+    private element;
+    private layout;
+    /**
+     * @param initialParams The initial parameters to be set on this new object
+     * @param callback An optional callback function to be notified when the object has been instantiated
+     * @param layout
+     */
+    constructor(element: T, layout: ILayout);
+    apply(state: LayoutsState): {
+        layouts: {
+            [x: string]: LayoutState | {
+                elements: LayoutElement[];
+                modificationID: string;
+                layout: ILayout;
+            };
+        };
+        serializableWorkflow: SerializableWorkflow;
+    };
+    private assignIndex;
+}
+/**
+ * Delete an element on the canvas
+ */
+declare class DeleteElementCommand extends CanvasCommand {
+    private id;
+    constructor(id: string);
+    apply(state: LayoutsState): {
+        layouts: {
+            [key: string]: LayoutState;
+        };
+        serializableWorkflow: SerializableWorkflow;
+    };
+}
+declare class FontColorCommand extends CanvasCommand {
+    private id;
+    private color;
+    private textFillSpotColor?;
+    constructor(id: string, color: string, textFillSpotColor?: TextFillSpotColor$1);
+    apply(state: LayoutsState): {
+        layouts: {
+            [x: string]: LayoutState;
+        };
+        serializableWorkflow: SerializableWorkflow;
+    };
+}
+declare class FontSizeCommand extends CanvasCommand {
+    private id;
+    private size;
+    constructor(id: string, size: number);
+    apply(state: LayoutsState): {
+        layouts: {
+            [x: string]: LayoutState;
+        };
+        serializableWorkflow: SerializableWorkflow;
+    };
+}
+declare class FontSourceCommand extends CanvasCommand {
+    private id;
+    private fontData;
+    constructor(id: string, fontData: FontData);
+    apply(state: LayoutsState): {
+        layouts: {
+            [x: string]: LayoutState;
+        };
+        serializableWorkflow: SerializableWorkflow;
+    };
+}
+declare class FontAlignmentCommand extends CanvasCommand {
+    private id;
+    private align;
+    constructor(id: string, align: "left" | "center" | "right");
+    apply(state: LayoutsState): {
+        layouts: {
+            [x: string]: LayoutState;
+        };
+        serializableWorkflow: SerializableWorkflow;
+    };
+}
+declare class UpdateImageSourceCommand extends CanvasCommand {
+    private id;
+    private src;
+    constructor(id: string, src: string);
+    apply(state: LayoutsState): LayoutsState;
+}
+/**
+ * TextChange will modify the text displayed in a text box
+ */
+declare class TextChangeCommand extends CanvasCommand {
+    private id;
+    private text;
+    constructor(id: string, text: string);
+    apply(state: LayoutsState): {
+        layouts: {
+            [x: string]: LayoutState;
+        };
+        serializableWorkflow: SerializableWorkflow;
+    };
+}
+declare class BringToFrontCommand extends CanvasCommand {
+    private id;
+    /**
+     * @param id The targeted element to bring to the front.
+     */
+    constructor(id: string);
+    apply(state: LayoutsState): {
+        layouts: {
+            [x: string]: LayoutState | {
+                elements: LayoutElement[];
+                modificationID: string;
+                layout: ILayout;
+            };
+        };
+        serializableWorkflow: SerializableWorkflow;
+    };
+}
+declare class BringToBackCommand extends CanvasCommand {
+    private id;
+    /**
+     * @param id The targeted element to bring to the back.
+     */
+    constructor(id: string);
+    apply(state: LayoutsState): {
+        layouts: {
+            [x: string]: LayoutState | {
+                elements: LayoutElement[];
+                modificationID: string;
+                layout: ILayout;
+            };
+        };
+        serializableWorkflow: SerializableWorkflow;
+    };
+}
+/**
+ * Bring an element forward by one layer. Does nothing if the element is already at the front.
+ */
+declare class BringForwardCommand extends CanvasCommand {
+    private id;
+    /**
+     * @param id The targeted element to bring to the front.
+     */
+    constructor(id: string);
+    apply(state: LayoutsState): {
+        layouts: {
+            [x: string]: LayoutState | {
+                elements: LayoutElement[];
+                modificationID: string;
+                layout: ILayout;
+            };
+        };
+        serializableWorkflow: SerializableWorkflow;
+    };
+}
+/**
+ * Send an element backwards by one layer. Does nothing if the element is already at the back.
+ */
+declare class SendBackwardsCommand extends CanvasCommand {
+    private id;
+    /**
+     * @param id The targeted element to bring to the front.
+     */
+    constructor(id: string);
+    apply(state: LayoutsState): {
+        layouts: {
+            [x: string]: LayoutState | {
+                elements: LayoutElement[];
+                modificationID: string;
+                layout: ILayout;
+            };
+        };
+        serializableWorkflow: SerializableWorkflow;
+    };
+}
+
+interface CommandState {
+    transaction: LayoutsState;
+    variation?: Partial<LayoutsState>;
+}
+interface LayoutComponentConfiguration {
+    renderingConfiguration: RenderingConfiguration;
+    outlineArea?: {
+        x?: number;
+        y?: number;
+        width?: number;
+        height?: number;
+        scale?: number;
+        hidden?: boolean;
+    };
+    viewBox?: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    };
+    maxHeight?: string;
+    maxWidth?: string;
+    height?: string | number;
+    width?: string | number;
+    position?: string;
+    borderRadius?: number;
+    outlineColor?: string;
+    backgroundColor?: string;
+}
+declare class CommandContext {
+    private state;
+    private stateCallbacks;
+    private id;
+    private prevCommands;
+    private nextCommands;
+    constructor();
+    registerStateCallback(callback: () => void): void;
+    unregisterStateCallback(callback: () => void): void;
+    getState(): CommandState | undefined;
+    private runStateCallbacks;
+    apply(command: CanvasCommand, leaveOffUndoStack?: boolean): void;
+    undo(): void;
+    redo(): void;
+    /**
+     * Find all commands in history with the given sequence ID,
+     * discard all but the last and overwrite its oldState.
+     */
+    flattenSequence(sequenceId: string, initialState: LayoutsState): void;
+    getLayoutById(layoutId: string): LayoutData;
+    getAllLayouts(): LayoutData[];
+    private getLayoutDataWithState;
+    initialize(layouts: ILayout[], reloadedState?: LayoutsState): void;
+    private commandReducer;
+}
+declare const getSvgElement: (layout: ILayout, elements: LayoutElement[], configuration: LayoutComponentConfiguration) => PapyrusNode;
+interface LayoutData {
+    layoutState: LayoutState;
+    Component: PapyrusComponent<SVGLayoutProps>;
+    getComponentWithProps: (configuration: LayoutComponentConfiguration) => PapyrusComponent<SVGLayoutProps>;
+}
+
 declare class LayoutPreviewService implements RenderableContextService {
     private readonly layouts;
     private handleCompleteRender;
@@ -1044,7 +1362,7 @@ declare abstract class GlobalPropertyHandle {
      * Returns all steps that share this property.
      * @param targetExperiences Optionally filter the steps to only those in the given experiences.
      */
-    protected getSharedSteps(targetExperiences?: WorkflowExperience[]): StepHandle<_spiffcommerce_papyrus.AnyStepData>[];
+    protected getSharedSteps(targetExperiences?: WorkflowExperience[]): StepHandle<AnyStepData>[];
     protected getStateValue(): string | undefined;
 }
 /**
@@ -2215,128 +2533,900 @@ interface WorkflowManager {
     getStepTags(stepId: string): string[];
 }
 
-interface StepService<T extends AnyStepData> {
+declare enum AssetType {
+    Data = "Data",
+    Font = "Font",
+    Frame = "Frame",
+    Illustration = "Illustration",
+    Image = "Image",
+    Model = "Model",
+    Material = "Material",
+    Color = "Color",
+    QuestionnaireCollateral = "QuestionnaireCollateral",
+    RequestCollateral = "RequestCollateral",
+    SignupCollateral = "SignupCollateral",
+    Video = "Video",
+    ColorProfile = "ColorProfile",
+    Environment = "Environment"
+}
+interface Asset {
+    /**
+     * The path of the asset within the bucket.
+     */
+    key?: string;
+    /**
+     * The name of this asset, the file name by default, otherwise a name set by the user.
+     */
+    name?: string;
     /**
-     * Initialize the given step, or reload from serialized data if present.
+     * The time that this asset was uploaded.
      */
-    init(stepData: Step<T>, workflowManager: WorkflowManager, reducerState?: LayoutsState): Promise<any>;
-}
-interface FileInfo {
+    createdAt?: string;
     /**
-     * The name of the file.
+     * The ID of this asset's license.
      */
-    name: string;
+    licenseId?: string;
     /**
-     * A blob object representing the
-     * data of the file.
+     * The content type registered with the bucket.
      */
-    blob: Blob;
+    mimeType?: string;
+    /**
+     * The ID of the person that uploaded this asset.
+     */
+    ownerId?: string;
+    /**
+     * The price to use this asset.
+     */
+    price?: number;
+    /**
+     * The asset type being dealt with.
+     */
+    type?: AssetType;
+    /**
+     * True when this asset is publicly available to anyone.
+     */
+    public?: boolean;
+    /**
+     * All versions for this asset, including the "latest" one which is the default and represented
+     * by the key of the asset itself.
+     */
+    objectVersions?: AssetObjectVersion[];
+    /**
+     * A list of tags for organisational purposes.
+     */
+    tags?: AssetTag[];
+    hubLink?: string;
+    fileLink?: string;
+    newVersionLink?: string;
+    invalidateLink?: string;
+    versions?: AssetVersion[];
+    metadata?: AssetMetadata[];
 }
 /**
- * A command along with a function to run afterwards.
+ * A tag for organisation of assets
  */
-interface CommandWithFollowup {
-    command?: CanvasCommand;
-    followup?: () => Promise<void>;
+interface AssetTag {
+    /**
+     * A unique ID.
+     */
+    id: string;
+    /**
+     * The human friendly display name of the tag.
+     */
+    name: string;
+    /**
+     * The key of the asset the tag is associated to.
+     */
+    assetKey: string;
+    /**
+     * The partner that owns that asset & tag.
+     */
+    partnerId: string;
+}
+interface AssetMetadata {
+    key: string;
+    value: string;
+}
+interface AssetVersion {
+    name: string;
+    link: string;
 }
 /**
- * The variant selections of a completed step.
+ * An object version is a snapshow of an asset at a given point in time. Each time
+ * the user updates the file associated to an asset a new object version is created.
+ * Users can then see a timeline of all object versions and switch between them.
  */
-interface SelectedVariants {
-    [stepName: string]: {
-        id: string;
-        name: string;
-        priceModifier: number;
-    }[];
+interface AssetObjectVersion {
+    /**
+     * The size of the file in bytes.
+     */
+    size: number;
+    /**
+     * A timestamp for when this version was created.
+     */
+    timestamp: string;
+    /**
+     * The id of the version, this is required in cases where we want to perform
+     * specific operations on a version such as making it the latest one or deleting it.
+     */
+    versionId: string;
+    /**
+     * The url that this asset should be called on when we want to get it,
+     * instead of the base key. This key is
+     */
+    versionedKey: string;
 }
-interface ExportedData {
-    [name: string]: {
-        value: string;
-        priceModifier: number;
-    };
+interface Step<T extends AnyStepData = AnyStepData> {
+    conditions?: Condition[];
+    data: T;
+    globalPropertyAspectConfigurations?: GlobalPropertyAspectConfiguration[];
+    helpText?: string;
+    mandatory?: boolean;
+    silent?: boolean;
+    option?: OptionResource;
+    optionId?: string;
+    stepName: string;
+    stepTitle: string;
+    tags?: string[];
+    type: StepType;
 }
-interface DesignCreationMessage {
-    additionalExternalProductId?: string;
-    additionalExternalVariantId?: string;
-    baseCost?: number;
-    designExternalVariants?: DesignExternalVariant[];
-    designProductId?: string;
-    designProductVariantId?: string;
-    event: string;
-    exportedData: ExportedData;
-    externalCartProductId?: string;
-    externalCartProductVariantId?: string;
-    lineItemImageUrl: string;
-    metadata?: {
-        [stepName: string]: string;
+interface GlobalPropertyAspectConfiguration {
+    aspectName?: string;
+    globalPropertyConfigurationId?: string;
+}
+interface GlobalPropertyConfiguration {
+    id: string;
+    aspects: GlobalPropertyConfigurationAspect[];
+}
+interface GlobalPropertyConfigurationAspect {
+    name: string;
+    type: AspectType;
+    title: string;
+    description: string;
+    entityId?: string;
+    conditions?: GlobalPropertyConfigurationAspectCondition[];
+}
+interface GlobalPropertyConfigurationAspectCondition {
+    targetAspectName?: string;
+    action: AspectConditionAction;
+    requiredVariantSelections: string[];
+}
+declare enum AspectConditionAction {
+    Show = "Show"
+}
+declare enum AspectType {
+    FileUpload = "FileUpload",
+    Option = "Option",
+    ColorOption = "ColorOption",
+    Text = "Text"
+}
+declare enum StepType {
+    Information = "Information",
+    Bulk = "Bulk",
+    DigitalContent = "DigitalContent",
+    Finish = "Finish",
+    Frame = "Frame",
+    Illustration = "Illustration",
+    Introduction = "Introduction",
+    Material = "Material",
+    Model = "Model",
+    Module = "Module",
+    Picture = "Picture",
+    /**
+     * @deprecated Use Frame instead.
+     */
+    Photo = "Photo",
+    ProductOverlay = "ProductOverlay",
+    Question = "Question",
+    Shape = "Shape",
+    SilentIllustration = "SilentIllustration",
+    Text = "Text"
+}
+interface StepAspect {
+    stepName: string;
+    stepType: StepType;
+    aspectType: StepAspectType;
+}
+declare enum StepAspectType {
+    Color = "Color",
+    Colors = "Colors",
+    Selection = "Selection",
+    Selections = "Selections",
+    Text = "Text",
+    Upload = "Upload"
+}
+interface Region {
+    top: number;
+    left: number;
+    width: number;
+    height: number;
+    layer?: number;
+    layerIndex?: number;
+    rotation: number;
+    panelId: string;
+    immutable?: boolean;
+    adjustmentBoundary?: {
+        x: number;
+        y: number;
+        height: number;
+        width: number;
     };
-    optionsCost: number;
-    processExecutionId?: string;
-    quantity?: number;
-    selectedVariants?: SelectedVariants;
-    sku?: string;
-    transactionId: string;
-    transactionOwnerId?: string;
-    weight?: number;
-    workflowViewerLink: string;
-    workflowViewerReadOnlyLink: string;
 }
-interface BundleDesignCreationMessage {
-    bundleId: string;
-    items: DesignCreationMessage[];
-    bundleOwnerId?: string;
+interface Condition {
+    requiredVariantSelections: string[];
+    action: string;
+    targetStepName: string;
+}
+interface StepAsset {
+    key: string;
+    previewKey?: string;
+}
+interface OptionResource {
+    id?: string;
+    localId?: string;
+    name: string;
+    type?: string;
+    variants?: VariantResource[];
+    defaultVariant?: VariantResource;
+    workflowId?: string;
+    public?: boolean;
+    displayType?: string;
+    colorProfile?: Asset;
+    integrationOptions?: IntegrationOptionResource[];
+}
+interface VariantResource {
+    id?: string;
+    name: string;
+    enabled: boolean;
+    priceModifier: number;
+    asset?: Asset;
+    material?: MaterialResource;
+    thumbnail?: Asset;
+    color?: string;
+    localId?: string;
+    default?: boolean;
+    namedColor?: string;
+    option?: OptionResource;
+}
+interface IntegrationOptionResource {
+    id?: string;
+    localId?: string;
+    integrationId: string;
+    externalProductId?: string;
 }
 /**
- * Represents a transaction.
+ * Represents a material resource that can be additively applied to
+ * a material targeted in the scene.
  */
-interface Transaction {
+type MaterialResource = {
     /**
-     * A unique identifier for this transaction. Useful for reloading and
-     * modifying state of the transaction.
+     * A unique identified for this material.
      */
     id: string;
     /**
-     * User-supplied name for the associated design.
+     * The name of this material
      */
-    designName?: string;
+    name: string;
     /**
-     * The workflow associated with this transaction.
+     * Defines the base color of a surface before any other calculations are made.
      */
-    workflowId?: string;
+    albedoMapKey?: string;
     /**
-     * Temporary ID that grants write permission to the transaction.
+     * Defines the transparency of a surface.
      */
-    transactionOwnerId?: string;
+    alphaMapKey?: string;
     /**
-     * The current state of the design.
+     * Defines shadowing on a surface.
      */
-    workflowState?: string;
+    ambientMapKey?: string;
     /**
-     * URL to a partner-specific logo intended to display during the workflow experience.
+     * Defines the amount of light being emitted from a surface.
      */
-    customLogoLink?: string;
+    emissionMapKey?: string;
     /**
-     * URL to a logo intended to display at the periphery of the workflow experience.
+     * Identical to roughness.
      */
-    workflowFooterLogoLink?: string;
+    metallicMapKey?: string;
     /**
-     * URL to the corresponding integration in the REST API.
+     * Defines the direction light will bounce in when it hits a point on a surface.
      */
-    restApiIntegrationLink?: string;
+    normalMapKey?: string;
     /**
-     * URL to redirect to when a workflow is finished.
+     * Used to define how smooth a surface is.
      */
-    callbackUrl?: string;
+    roughnessMapKey?: string;
     /**
-     * Product that this transaction belongs to.
+     * Used to define refraction of light on a surface.
      */
-    product?: Product;
+    refractionMapKey?: string;
     /**
-     * The integration product related to this lineitem.
+     * The intensity of refraction, when refraction is enabled via a texture.
      */
-    integrationProduct?: IntegrationProductResource;
+    refractionIntensity?: number;
     /**
-     * Whether this transaction has previously been ordered.
+     * Use to define reflection of light on a surface.
+     */
+    reflectionMapKey?: string;
+    /**
+     * The intensity of reflection, when reflection is enabled via a texture.
+     */
+    reflectionIntensity?: number;
+    /**
+     * The rotation of the reflection map (around the up axis, in degrees), when reflection is enabled via a texture.
+     */
+    reflectionRotation?: number;
+    /**
+     * When enabled the material will be displayed with a clearcoat affect for simulating coated plastic surfaces.
+     */
+    clearCoat: MaterialEffectMode;
+    /**
+     * Index of refraction when clear coat is enabled.
+     */
+    clearCoatIOR?: number;
+    /**
+     * The date that this material resource was created
+     */
+    createdAt: string;
+    /**
+     * The date that this material resource was last updated.
+     */
+    updatedAt: string;
+};
+/**
+ * Used to specify the behavior of a material effect such as clearcoat, sheen and translucency.
+ */
+declare enum MaterialEffectMode {
+    /**
+     * When a material variant effect specifies 'None' the effect doesn't change in any way. This is the default behavior.
+     */
+    None = "None",
+    /**
+     * When a material variant effect specifies 'RemoveWhenSelected' the effect is removed.
+     */
+    RemoveWhenSelected = "RemoveWhenSelected",
+    /**
+     * When a material variant effect specifies 'ApplyWhenSelected' the effect is enabled.
+     */
+    ApplyWhenSelected = "ApplyWhenSelected"
+}
+type AnyStepData = InformationStepData | BulkStepData | DigitalContentStepData | FinalizeStepData | FrameStepData | IllustrationStepData | MaterialStepData | ModelStepData | ModuleStepData | PictureStepData | QuestionStepData | ShapeStepData | SilentStepData | TextStepData;
+interface Animatable {
+    lookAtAnimation?: CameraAnimation;
+    modelAnimation?: ModelAnimation;
+}
+interface BulkStepData extends Animatable {
+    aspects: StepAspect[];
+}
+interface InformationStepData extends Animatable, Placeable {
+    content: string;
+}
+interface DigitalContentStepData extends Animatable, Placeable {
+    baseUrl: string;
+    varyUpload?: boolean;
+}
+interface FrameStepData extends Animatable, Placeable, Colorable {
+    hideSelectionInCart?: boolean;
+    hideImageInCart?: boolean;
+    colorPickerEnabled?: boolean;
+    displaySelectionOnFinishStep?: boolean;
+    displayImageOnFinishStep?: boolean;
+    disablePlaceholder?: boolean;
+    initialZoomLevel?: number;
+    markSelectionAsCustomField?: boolean;
+    markImageAsCustomField?: boolean;
+    maxColors?: number;
+    focalBlur?: boolean;
+    focalBlurRadius?: number;
+    focalBlurStrength?: number;
+    forceImageCover?: boolean;
+    overlayImageKey?: string;
+    placeholderImageKey?: string;
+    placeholderImageUrl?: string;
+    varySelection?: boolean;
+    varyUpload?: boolean;
+    whitelistedExtensions: string[];
+}
+interface IllustrationStepData extends Animatable, Placeable, Colorable {
+    hideSelectionInCart?: boolean;
+    hideColorsInCart?: boolean;
+    displaySelectionOnFinishStep?: boolean;
+    displayColorsOnFinishStep?: boolean;
+    markSelectionAsCustomField?: boolean;
+    markColorsAsCustomField?: boolean;
+    assetKeys?: string[];
+    assets?: StepAsset[];
+    defaultAssetKey?: string;
+    colorPickerEnabled?: boolean;
+    varySelection?: boolean;
+    varyColors?: boolean;
+}
+interface MaterialStepData extends Animatable {
+    hideSelectionInCart?: boolean;
+    displaySelectionOnFinishStep?: boolean;
+    markSelectionAsCustomField?: boolean;
+    targetMaterials: string[];
+    varySelection?: boolean;
+}
+interface ModelStepData extends Animatable {
+    replaceProductModel?: boolean;
+    hideSelectionInCart?: boolean;
+    displaySelectionOnFinishStep?: boolean;
+    markSelectionAsCustomField?: boolean;
+    varySelection?: boolean;
+}
+interface ModuleStepData extends Animatable, Placeable {
+    hideTextInCart?: boolean;
+    displayTextOnFinishStep?: boolean;
+    markTextAsCustomField?: boolean;
+    module: string;
+    maxLength: number;
+    varyText?: string;
+}
+interface PictureStepData extends Animatable, Placeable {
+    hideSelectionInCart?: boolean;
+    displaySelectionOnFinishStep?: boolean;
+    markSelectionAsCustomField?: boolean;
+    varySelection?: boolean;
+}
+interface QuestionStepData extends Animatable {
+    hideSelectionsInCart?: boolean;
+    displaySelectionsOnFinishStep?: boolean;
+    markSelectionsAsCustomField?: boolean;
+    varySelections?: boolean;
+}
+interface ShapeStepData extends Animatable, Placeable {
+    hideSelectionInCart?: boolean;
+    displaySelectionOnFinishStep?: boolean;
+    markSelectionAsCustomField?: boolean;
+    defaultColour?: string;
+    excludeFromPrint?: boolean;
+    varySelection?: boolean;
+}
+interface TextStepData extends Animatable, Placeable, Colorable {
+    hideSelectionInCart?: boolean;
+    hideFillImageInCart?: boolean;
+    hideColorInCart?: boolean;
+    hideTextInCart?: boolean;
+    displaySelectionOnFinishStep?: boolean;
+    displayFillImageOnFinishStep?: boolean;
+    displayColorOnFinishStep?: boolean;
+    displayTextOnFinishStep?: boolean;
+    markSelectionAsCustomField?: boolean;
+    markFillImageAsCustomField?: boolean;
+    markColorAsCustomField?: boolean;
+    markTextAsCustomField?: boolean;
+    allowNewlines?: boolean;
+    defaultText: string;
+    deleteDefaultOnFocus?: boolean;
+    replaceableText?: string;
+    font: string;
+    colorPickerEnabled?: boolean;
+    maxLength: number;
+    maxSize?: number;
+    minSize?: number;
+    size: number;
+    textAlign: string;
+    colour: string;
+    uppercase?: boolean;
+    vertical?: boolean;
+    verticalAlign: string;
+    curved?: boolean;
+    paths?: string[];
+    userCanReplaceText?: boolean;
+    varySelection?: boolean;
+    varyText?: boolean;
+    varyColor?: boolean;
+    imageFillOption?: OptionResource;
+    imageFillScale?: number;
+}
+interface SilentStepData extends Animatable, Placeable {
+    asset?: Asset;
+    excludeFromPrint?: boolean;
+}
+type FinalizeStepData = Animatable;
+/**
+ * A colorable step is a step that can have an optional color option assigned to help drive color palette choices.
+ */
+interface Colorable {
+    colorOption?: OptionResource;
+}
+/**
+ * A placeable step is a step that can be placed on a canvas in a set of specific positions.
+ */
+interface Placeable {
+    regions: Region[];
+}
+interface StepService<T extends AnyStepData> {
+    /**
+     * Initialize the given step, or reload from serialized data if present.
+     */
+    init(stepData: Step<T>, workflowManager: WorkflowManager, reducerState?: LayoutsState): Promise<any>;
+}
+interface LayoutsState {
+    layouts: {
+        [id: string]: LayoutState;
+    };
+    serializableWorkflow: SerializableWorkflow;
+}
+/**
+ * A workflow step in the process of being serialized or deserialized.
+ */
+interface SerializableStep {
+    stepName: string;
+    storage?: StepStorage;
+    selectedVariants?: SerializableVariant[];
+}
+interface SerializableWorkflow {
+    steps: SerializableStep[];
+}
+interface SerializableVariant {
+    id: string;
+    priceModifier: number;
+}
+interface StepStorage {
+    bulkIsConnected?: boolean;
+    color?: string;
+    colorProfileAssetKey?: string;
+    colors?: {
+        [key: string]: IllustrationColorObject;
+    };
+    colour?: string;
+    currentFrameSources?: string[];
+    customiseAllText?: boolean;
+    defaultCleared?: boolean;
+    fillImage?: TextFillImage;
+    frameOffsetsList?: FrameOffsets[];
+    framePatternData?: {
+        originalAssetKey?: string;
+        backgroundRemovedAssetKey?: string;
+        useOriginalAsset?: boolean;
+    };
+    framePatternSrc?: string;
+    inputText?: string;
+    overrideGlobalConfiguration?: boolean;
+    overrideGlobalConfigurations?: {
+        [key: string]: boolean;
+    };
+    text?: string;
+    videoShortUrl?: string;
+    videoUrl?: string;
+}
+interface IllustrationColorObject {
+    browserValue: string;
+    spotColor?: {
+        profileName: string;
+        namedColor: string;
+    };
+    pmsValue?: string;
+}
+interface FrameOffsets {
+    y: number;
+    x: number;
+    zoom: number;
+}
+interface LayoutState {
+    /**
+     * The elements currently on this layout.
+     */
+    elements: LayoutElement[];
+    /**
+     * A file describing the properties of this layout.
+     */
+    layout: ILayout;
+    /**
+     * A unique ID regenerated each time this layout is changed.
+     */
+    modificationID: string;
+}
+/**
+ * Represents an element on the SVG canvas. This may comprise of multiple SVG elements when
+ * output such as path elements, defs, etc. All concrete elements must implement this interface.
+ */
+interface LayoutElement extends Layerable {
+    /**
+     * The unique identifier for this element.
+     */
+    id: string;
+    /**
+     * If the element was made from a workflow step, this is its step name.
+     */
+    stepName?: string;
+    /**
+     * If the element was made from a workflow step, this is its region.
+     */
+    stepRegion?: Region;
+    /**
+     * The type of this element
+     */
+    type: LayoutElementType;
+    /**
+     * Horizontal offset from top left origin point.
+     */
+    x: number;
+    /**
+     * Vertical offset from top left origin point.
+     */
+    y: number;
+    /**
+     * The height in pixels of the element.
+     */
+    width: number;
+    /**
+     * The height in pixels of the element.
+     */
+    height: number;
+    /**
+     * The rotation in degrees.
+     */
+    rotation: number;
+    /**
+     * The element is considered immutable and shouldn't be modifiable by the user.
+     */
+    immutable?: boolean;
+    /**
+     * When true this element should be rendered on top of all other elements always.
+     */
+    productOverlay?: boolean;
+    /**
+     * When true, this element will be removed from SVGString output when
+     * the removeExcludedElements flag is set to true.
+     */
+    excludeFromExport?: boolean;
+    /**
+     * Value to use as the mask attribute if the element does not correspond to a step.
+     */
+    mask?: string;
+    /**
+     * Injected by the LayoutsProvider if required. Shouldn't be
+     * used by the user. This is a simple way to pass global rendering configuration
+     * to individual elements without having to set up a react context.
+     */
+    _renderingConfiguration?: RenderingConfiguration;
+}
+/**
+ * Represents a layerable entity. Layerable entities can be sorted within our system for rendering purposes.
+ */
+interface Layerable {
+    /**
+     * The layer that this element exists on. Elements on a higher layer can never
+     * be below an element on a lower layer. 0 by default.
+     */
+    layer?: number;
+    /**
+     * The index of this element on the current layer, if no layer is present it is assumed to be 0.
+     * For the index 0 is lower, > 0 is higher
+     */
+    layerIndex?: number;
+}
+interface TextFillImage {
+    src: string;
+    width: number;
+    height: number;
+    scale: number;
+}
+/**
+ * The reason we need to turn a layout into an SVG.
+ */
+declare enum LayoutRenderingPurpose {
+    ThreeD = "ThreeD",
+    FreeDesign = "FreeDesign",
+    Print = "Print"
+}
+/**
+ * Specifies configuration for rendering a Papyrus canvas as an SVG string.
+ */
+interface RenderingConfiguration {
+    /**
+     * Sets the viewbox to a custom value when subregions are desired.
+     */
+    region?: PreviewRegion;
+    /**
+     * Excludes marked elements from the SVG output when true.
+     */
+    removeExcludedElements?: boolean;
+    purpose: LayoutRenderingPurpose;
+    /**
+     * When true any cached data will be ignored and assets will be rendered in full
+     * with the properties they are provided.
+     */
+    omitCachedFields?: boolean;
+    /**
+     * When true, spot colors will be output, when provided, into any
+     * fill or stroke style in an illustration.
+     */
+    spotColors?: boolean;
+    colorProfiles?: ColorProfileProps[];
+    /**
+     * Allow for debug rendering on elements.
+     */
+    debug?: boolean;
+}
+interface ColorProfileProps {
+    name: string;
+    key: string;
+}
+/**
+ * The possible types for an element.
+ */
+declare enum LayoutElementType {
+    Frame = "frame",
+    Group = "group",
+    Image = "image",
+    Pattern = "pattern",
+    Illustration = "illustration",
+    Textbox = "textbox"
+}
+/**
+ * Represents a layout contained within a specific user created design.
+ */
+interface ILayout {
+    /**
+     * The internal identifier for this layout.
+     */
+    id: string;
+    /**
+     * A link to the json resource describing this layout
+     */
+    layoutPath?: string;
+    /**
+     * The index this layout appears at in its design
+     */
+    index: number;
+    /**
+     * An id for the panel associated to this layout.
+     */
+    panelId: string;
+    /**
+     * The date this layout was created.
+     */
+    createdAt: Date;
+    /**
+     * The date this layout was last updated.
+     */
+    updatedAt: Date;
+    /**
+     * The height of the layout. This matches the background element on the canvas as a convenience.
+     */
+    height: number;
+    /**
+     * The width of the layout. This matches the background element on the canvas as a convenience.
+     */
+    width: number;
+    /**
+     * When true this layout should contain no background fill.
+     */
+    transparentBackground?: boolean;
+    previewRegion?: {
+        height: number;
+        width: number;
+        top: number;
+        left: number;
+    };
+    useEditableArea?: boolean;
+    editableArea?: {
+        x: number;
+        y: number;
+        height: number;
+        width: number;
+    };
+    name: string;
+}
+interface FileInfo {
+    /**
+     * The name of the file.
+     */
+    name: string;
+    /**
+     * A blob object representing the
+     * data of the file.
+     */
+    blob: Blob;
+}
+/**
+ * A command along with a function to run afterwards.
+ */
+interface CommandWithFollowup {
+    command?: CanvasCommand;
+    followup?: () => Promise<void>;
+}
+/**
+ * The variant selections of a completed step.
+ */
+interface SelectedVariants {
+    [stepName: string]: {
+        id: string;
+        name: string;
+        priceModifier: number;
+    }[];
+}
+interface ExportedData {
+    [name: string]: {
+        value: string;
+        priceModifier: number;
+    };
+}
+interface DesignCreationMessage {
+    additionalExternalProductId?: string;
+    additionalExternalVariantId?: string;
+    baseCost?: number;
+    designExternalVariants?: DesignExternalVariant[];
+    designProductId?: string;
+    designProductVariantId?: string;
+    event: string;
+    exportedData: ExportedData;
+    externalCartProductId?: string;
+    externalCartProductVariantId?: string;
+    lineItemImageUrl: string;
+    metadata?: {
+        [stepName: string]: string;
+    };
+    optionsCost: number;
+    processExecutionId?: string;
+    quantity?: number;
+    selectedVariants?: SelectedVariants;
+    sku?: string;
+    transactionId: string;
+    transactionOwnerId?: string;
+    weight?: number;
+    workflowViewerLink: string;
+    workflowViewerReadOnlyLink: string;
+}
+interface BundleDesignCreationMessage {
+    bundleId: string;
+    items: DesignCreationMessage[];
+    bundleOwnerId?: string;
+}
+/**
+ * Represents a transaction.
+ */
+interface Transaction {
+    /**
+     * A unique identifier for this transaction. Useful for reloading and
+     * modifying state of the transaction.
+     */
+    id: string;
+    /**
+     * User-supplied name for the associated design.
+     */
+    designName?: string;
+    /**
+     * The workflow associated with this transaction.
+     */
+    workflowId?: string;
+    /**
+     * Temporary ID that grants write permission to the transaction.
+     */
+    transactionOwnerId?: string;
+    /**
+     * The current state of the design.
+     */
+    workflowState?: string;
+    /**
+     * URL to a partner-specific logo intended to display during the workflow experience.
+     */
+    customLogoLink?: string;
+    /**
+     * URL to a logo intended to display at the periphery of the workflow experience.
+     */
+    workflowFooterLogoLink?: string;
+    /**
+     * URL to the corresponding integration in the REST API.
+     */
+    restApiIntegrationLink?: string;
+    /**
+     * URL to redirect to when a workflow is finished.
+     */
+    callbackUrl?: string;
+    /**
+     * Product that this transaction belongs to.
+     */
+    product?: Product;
+    /**
+     * The integration product related to this lineitem.
+     */
+    integrationProduct?: IntegrationProductResource;
+    /**
+     * Whether this transaction has previously been ordered.
      */
     isOrdered?: boolean;
     /**
@@ -2475,6 +3565,19 @@ interface Integration {
     logo: string;
     partner: Partner;
 }
+interface Theme {
+    configuration?: string;
+    fontAsset?: Asset;
+    id?: string;
+    name?: string;
+    primaryColor?: string;
+    secondaryColor?: string;
+    textColor?: string;
+    themeLayout?: {
+        id?: string;
+        name?: string;
+    };
+}
 declare enum IntegrationType {
     Hub = "Hub",
     Shopify = "Shopify"
@@ -2547,7 +3650,7 @@ interface Product {
     /**
      * A description of the Product, written in Markdown.
      */
-    description: string;
+    description?: string;
     /**
      * A URL to the image asset associated with this product.
      */
@@ -2838,87 +3941,585 @@ interface BundleStakeholder {
     customer?: Customer;
     type?: StakeholderType;
 }
-interface BundleStakeholderInput {
-    type: StakeholderType;
-    customerDetails: CustomerDetailsInput;
+interface BundleStakeholderInput {
+    type: StakeholderType;
+    customerDetails: CustomerDetailsInput;
+}
+type ProductCollectionResource = {
+    id: string;
+    globalPropertyConfiguration?: GlobalPropertyConfiguration;
+    productCollectionProducts?: ProductCollectionProductResource[];
+    name: string;
+    description?: string;
+    image?: Asset;
+    transformCollection?: TransformCollection;
+};
+type ProductCollectionProductResource = {
+    id: string;
+    productCollection?: ProductCollectionResource;
+    productCollectionId?: string;
+    product: Product;
+    productId: string;
+    workflowId?: string;
+};
+type GlobalPropertyState = {
+    id: string;
+    aspects: GlobalPropertyStateAspect[];
+};
+type GlobalPropertyStateAspect = {
+    name: string;
+    value: string;
+    type?: AspectType;
+    storage?: GlobalPropertyStateAspectStorage;
+};
+type GlobalPropertyStateAspectStorage = GlobalPropertyStateFileUploadStorage | GlobalPropertyStateColorOptionStorage;
+type GlobalPropertyStateFileUploadStorage = {
+    originalAssetKey?: string;
+    backgroundRemovedAssetKey?: string;
+    useOriginalAsset?: boolean;
+};
+type GlobalPropertyStateColorOptionStorage = {
+    customColor?: string;
+};
+interface BundleStateTransform {
+    position: Vector3;
+    rotation: Vector3;
+    scale: Vector3;
+}
+interface Vector3 {
+    x: number;
+    y: number;
+    z: number;
+}
+interface TransformCollection {
+    id: string;
+    name: string;
+    transforms: TransformCollectionTransform[];
+}
+interface TransformCollectionTransform {
+    id: string;
+    name: string;
+    position: Vector3;
+    rotation: Vector3;
+    scale: Vector3;
+}
+type Extendable<T> = T & {
+    [key: string]: any;
+};
+interface Metafield {
+    id: string;
+    createdAt: string;
+    updatedAt: string;
+    entityId: string;
+    value: string;
+    metafieldConfiguration: MetafieldConfiguration;
+}
+interface MetafieldConfiguration {
+    id: string;
+    createdAt: string;
+    updatedAt: string;
+    entityType: string;
+    metafieldType: string;
+    name: string;
+}
+declare enum TextAlgorithm {
+    /**
+     * An algorithm that finds the best size for text based
+     * on a range minSize <-> maxSize
+     * NOTE: Default, this is how we've calculated historically.
+     */
+    Autosize = "Autosize",
+    /**
+     * An algorithm that follows behavior of other popular
+     * text editing applications.
+     */
+    Traditional = "Traditional"
+}
+interface FrameElement extends LayoutElement {
+    path: string;
+    /**
+     * Assigns the 'data-frame-width' attribute to the frame element. The rasterizer we use has issues with images inside
+     * patterns. This is a workaround to ensure that the pattern is correctly sized.
+     */
+    dataWidth?: number;
+    /**
+     * Assigns the 'data-frame-height' attribute to the frame element. The rasterizer we use has issues with images inside
+     * patterns. This is a workaround to ensure that the pattern is correctly sized.
+     */
+    dataHeight?: number;
+    disablePlaceholder?: boolean;
+    scaleX: number;
+    scaleY: number;
+    opacity?: number;
+    pattern?: Pattern;
+    focalBlur?: boolean;
+    focalBlurStrength?: number;
+    focalBlurRadius?: number;
+    forceImageCover?: boolean;
+    useThreshold?: boolean;
+    invertThreshold?: boolean;
+    threshold?: number;
+    thresholdSaturation?: number;
+}
+/**
+ * A pattern object stores data relevant for displaying an image within a frame, including
+ * the source for the image itself and also dimensions and offsets.
+ */
+interface Pattern extends Omit<LayoutElement, "type"> {
+    /**
+     * The image to use when a file is generated, this should be an original high resolution source file.
+     */
+    src: string;
+    /**
+     * Scaling X of image within frame.
+     */
+    scaleX: number;
+    /**
+     * Scaling Y of image within frame.
+     */
+    scaleY: number;
+    /**
+     * The SVG document that the src represents. This must be the actual content string of the document, rather than a URL.
+     */
+    svg?: string;
+    /**
+     * A map of ID to color code, used to store color selections in the SVG. Only applicable when `svg` is provided.
+     */
+    colors?: {
+        [key: string]: ColorDefinition;
+    };
+}
+interface IllustrationElement extends LayoutElement {
+    /**
+     * When provided a src will be used to rehyrdrate the svg field. On serialization
+     * the svg field will be dropped and only src will remain.
+     */
+    src?: string;
+    /**
+     * The string representation of the SVG element. A valid SVG document.
+     */
+    svg?: string;
+    /**
+     * A cached image representation of this SVG, to be used for faster
+     * rendering in performance critical code.
+     */
+    cachedObjectURL?: string;
+    /**
+     * A map of ID to color code, used to store color selections in the SVG.
+     */
+    colors: {
+        [key: string]: ColorDefinition;
+    };
+}
+/**
+ * Represents a raster image on the Papyrus canvas.
+ */
+interface ImageElement extends LayoutElement {
+    /**
+     * A src for the image. This will be used in place of the data URL in server environments and should
+     * be original image quality.
+     */
+    src: string;
+    /**
+     * https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/preserveAspectRatio
+     */
+    preserveAspectRatio?: string;
+}
+interface TextboxElement extends LayoutElement {
+    /**
+     * Horizontal alignment of text. eg. left, center, right.
+     */
+    align?: string;
+    /**
+     * An image to use as the fill instead of a color.
+     */
+    textFillImage?: TextFillImage;
+    /**
+     * Fill color of this text. Any value that can be parsed by css fill should work here.
+     */
+    fill: string;
+    /**
+     * The font size.
+     */
+    fontSize: number;
+    /**
+     * Information about the font family used to render this text.
+     */
+    fontData: FontData | undefined;
+    /**
+     * Text computed for this textbox.
+     */
+    text?: string;
+    /**
+     * Per element user input. Not used by the layout engine. Instead
+     * used to store user input for textbox to preserve newlines.
+     */
+    input?: string;
+    /**
+     * Should the text layout top to bottom.
+     */
+    vertical?: boolean;
+    /**
+     * The height between text lines.
+     */
+    lineHeight?: number;
+    /**
+     * The alignment of text vertically, top center or bottom.
+     */
+    verticalAlign: string;
+    /**
+     * When true the text will be rendered using the provided curve.
+     */
+    curved?: boolean;
+    /**
+     * The curve to use when curved = true. Ignored otherwise.
+     */
+    paths?: string[];
+    /**
+     * The algorithm to use when laying out text.
+     */
+    algorithm?: TextAlgorithm;
+    fillSpotColorDefinition?: SpotColorDefinition;
+}
+interface FontData {
+    assetUrl: string;
+    name: string;
+}
+/**
+ * Contains configuration for font sizing.
+ *
+ * When min/maxSize values are set we interpret the textbox as being
+ * in "Variable Mode" which essentially
+ * auto sizes the text based on a given region.
+ *
+ * When only size is set, we interpret the textbox as being in "Fixed Mode" where
+ * text is computed at a fixed font size.
+ */
+interface SizeRange {
+    /**
+     * Variable Mode: A maximum size
+     */
+    maxSize?: number;
+    /**
+     * Variable Mode: Minimum Size
+     */
+    minSize?: number;
+    /**
+     * Fixed Mode: A Fixed font size to be used at all times.
+     */
+    size: number;
+}
+interface ColorDefinition {
+    /**
+     * Represents the color value in hex or any other
+     * browser supported format. This will be used when rendering the canvas
+     * in an environment that doesn't support spot color.
+     */
+    browserValue: string;
+    /**
+     * A spot color definition. This is optional and will
+     * be applied to the SVG returned by toString when configured allowing
+     * filegen to output spot colors.
+     */
+    spotColor?: SpotColorDefinition;
+    /**
+     * Represents the color value in the PMS colorspace.
+     */
+    pmsValue?: string;
+}
+/**
+ * A container for data related to a specific spotcolor. toString
+ * can be used to output a string expected by Filegen inside a stroke or fill.
+ */
+interface SpotColorDefinition {
+    /**
+     * The name of the profile being used.
+     */
+    profileName: string;
+    /**
+     * The named color expected by the profile.
+     */
+    namedColor: string;
+}
+/**
+ * A container for data related to a specific spotcolor. toString
+ * can be used to output a string expected by Filegen inside a stroke or fill.
+ */
+interface SpotColorDefinition {
+    /**
+     * The name of the profile being used.
+     */
+    profileName: string;
+    /**
+     * The named color expected by the profile.
+     */
+    namedColor: string;
+}
+interface TextFillSpotColor$1 {
+    profileName: string;
+    namedColor: string;
+}
+interface PatternImageData {
+    /**
+     * The original src of the image.
+     */
+    src: string;
+    /**
+     *  The natural width of the image.
+     */
+    width: number;
+    /**
+     * The natural height of the image.
+     */
+    height: number;
+    /**
+     * Cached result of the calculation width/height.
+     */
+    aspect: number;
+    /**
+     * The SVG document that the src represents. This must be the actual content string of the document, rather than a URL.
+     */
+    svg?: string;
+    /**
+     * A map of ID to color code, used to store color selections in the SVG. Only applicable when `svg` is provided.
+     */
+    colors?: {
+        [key: string]: ColorDefinition;
+    };
 }
-type ProductCollectionResource = {
-    id: string;
-    globalPropertyConfiguration?: GlobalPropertyConfiguration;
-    productCollectionProducts?: ProductCollectionProductResource[];
-    name: string;
-    description?: string;
-    image?: Asset;
-    transformCollection?: TransformCollection;
-};
-type ProductCollectionProductResource = {
-    id: string;
-    productCollection?: ProductCollectionResource;
-    productCollectionId?: string;
-    product: Product;
-    productId: string;
-    workflowId?: string;
-};
-type GlobalPropertyState = {
-    id: string;
-    aspects: GlobalPropertyStateAspect[];
-};
-type GlobalPropertyStateAspect = {
-    name: string;
-    value: string;
-    type?: AspectType;
-    storage?: GlobalPropertyStateAspectStorage;
-};
-type GlobalPropertyStateAspectStorage = GlobalPropertyStateFileUploadStorage | GlobalPropertyStateColorOptionStorage;
-type GlobalPropertyStateFileUploadStorage = {
-    originalAssetKey?: string;
-    backgroundRemovedAssetKey?: string;
-    useOriginalAsset?: boolean;
-};
-type GlobalPropertyStateColorOptionStorage = {
-    customColor?: string;
-};
-interface BundleStateTransform {
-    position: Vector3;
-    rotation: Vector3;
-    scale: Vector3;
+/**
+ * Defines the direction of scaling, can be used
+ * to determine the anchor point of a scale calculation.
+ */
+declare enum ScaleAxis {
+    North = 0,
+    Northeast = 1,
+    East = 2,
+    Southeast = 3,
+    South = 4,
+    Southwest = 5,
+    West = 6,
+    Northwest = 7
 }
-interface Vector3 {
+/**
+ * A point in a 2D coordinate space.
+ */
+interface Point {
     x: number;
     y: number;
-    z: number;
 }
-interface TransformCollection {
+interface Workflow {
+    defaultPreviewPanelIndex?: number;
+    deletedAt?: Date;
     id: string;
+    previewAssetKey?: string;
+    previewImageUrl?: string;
     name: string;
-    transforms: TransformCollectionTransform[];
+    introduction: string;
+    panels: WorkflowPanel[];
+    showModelOnFinishStep: boolean;
+    showPricing?: boolean;
+    baseCurrency?: string;
+    showPlusInVariantPrices?: boolean;
+    allowProofDownload: boolean;
+    steps: Step<AnyStepData>[];
+    stepGroups: StepGroup[];
+    theme?: {
+        primaryColour: string;
+        textColour: string;
+    };
+    globalPreviewConfig?: PreviewConfiguration;
+    finalizeStepConfig?: FinalizeStepConfig;
+    partnerId?: string;
+    toggleBulkSourceView?: boolean;
+    overrideTheme?: Theme;
+    globalPropertyConfiguration?: GlobalPropertyConfiguration;
 }
-interface TransformCollectionTransform {
-    id: string;
+interface WorkflowPanel {
+    height: number;
+    width: number;
     name: string;
-    position: Vector3;
-    rotation: Vector3;
-    scale: Vector3;
-}
-type Extendable<T> = T & {
-    [key: string]: any;
-};
-interface Metafield {
-    id: string;
-    createdAt: string;
-    updatedAt: string;
-    entityId: string;
-    value: string;
-    metafieldConfiguration: MetafieldConfiguration;
+    index: number;
+    transparentBackground?: boolean;
+    previewRegion?: PreviewRegion;
+    useEditableArea?: boolean;
+    editableArea?: {
+        x: number;
+        y: number;
+        height: number;
+        width: number;
+    };
 }
-interface MetafieldConfiguration {
-    id: string;
-    createdAt: string;
-    updatedAt: string;
-    entityType: string;
-    metafieldType: string;
+interface StepGroup {
+    id?: string;
     name: string;
+    stepNames: string[];
+}
+interface FinalizeStepConfig {
+    termsMarkdown?: string;
+    modelAnimation?: ModelAnimation;
+    lookAtAnimation?: CameraAnimation;
+    previewRegion?: {
+        left: number;
+        top: number;
+        width: number;
+        height: number;
+    };
+}
+interface PreviewRegion {
+    top: number;
+    left: number;
+    width: number;
+    height: number;
+}
+interface PreviewRegion {
+    top: number;
+    left: number;
+    width: number;
+    height: number;
+}
+interface ModelAnimation {
+    /**
+     * A value it seconds along the animation timeline to begin at.
+     */
+    from?: number;
+    /**
+     * A value in seconds along the animation timeline to end at.
+     */
+    to?: number;
+    /**
+     * When true the animation will loop. The only behaviour currently is to reset
+     * back to from but we could have it bounce back and forth and/or follow a curve.
+     */
+    loop?: boolean;
+    /**
+     * The name of the animation to play.
+     */
+    name?: string;
+}
+/**
+ * A CameraAnimation specifies a discrete state that the camera should
+ * animate to. This state represents the final position of the camera after animations have run.
+ */
+interface CameraAnimation {
+    /**
+     * The longitutude in degrees the camera should animate to.
+     */
+    lonDeg: number;
+    /**
+     * The lattitude in degrees the camera should animnate to.
+     */
+    latDeg: number;
+    /**
+     * An optional target for the camera to focus on in the scene.
+     */
+    target?: {
+        x: number;
+        y: number;
+        z: number;
+    };
+    /**
+     * A value in scene units specifying camera distance from the target.
+     */
+    radius?: number;
+}
+/**
+ * Settings related to the 3D preview for use at either a global level or at per step level. The global
+ * values can be a default if per step values aren't specified.
+ */
+interface PreviewConfiguration {
+    /**
+     * @deprecated Removed in favor of backgroundColor as a simple hexadecimal color value.
+     */
+    clearColor?: [number, number, number];
+    /**
+     * The color expected to be seen in the background of the product
+     */
+    backgroundColor?: string;
+    /**
+     * The closest zoom the camera can achieve to the product.
+     */
+    maxZoomOverride?: number;
+    /**
+     * The furthest zoom the camera can achieve to the product.
+     */
+    minZoomOverride?: number;
+    /**
+     * The environment file used to calculate product lighting.
+     */
+    environmentFile?: string;
+    /**
+     * The lowest point, vertically, that the camera can rotate to.
+     * https://doc.babylonjs.com/divingDeeper/cameras/camera_introduction
+     */
+    lowerBetaLimitDeg?: number;
+    /**
+     * The highest point, vertically, that the camera can rotate to.
+     * https://doc.babylonjs.com/divingDeeper/cameras/camera_introduction
+     */
+    upperBetaLimitDeg?: number;
+    /**
+     * The leftmost point, horizontally, that the camera can rotate to.
+     * https://doc.babylonjs.com/divingDeeper/cameras/camera_introduction
+     */
+    lowerAlphaLimitDeg?: number;
+    /**
+     * The rightmost point, horizontally, that the camera can rotate to.
+     * https://doc.babylonjs.com/divingDeeper/cameras/camera_introduction
+     */
+    upperAlphaLimitDeg?: number;
+    /**
+     * When set the product while rotate slowly
+     */
+    autoRotation?: boolean;
+    /**
+     * Time in milliseconds before the product starts rotating after a user input has taken control.
+     */
+    idleTimeBeforeRotation?: number;
+    /**
+     * When set the 3D preview won't attempt to orient the product automatically to its front view at load.
+     */
+    disableAutomaticOrientation?: boolean;
+    /**
+     * When true the action bar won't be displayed to the user.
+     */
+    disableActionBar?: boolean;
+    /**
+     * When true the AR button will be displayed to the user.
+     */
+    enableAR?: boolean;
+}
+declare enum UnitOfMeasurement {
+    Pixel = "px",
+    Millimeter = "mm",
+    Centimeter = "cm"
+}
+type PapyrusComponent<T = any> = FunctionComponent<T>;
+type PapyrusNode = ReactNode;
+
+declare class OptionService {
+    /**
+     * Allows for retrieving an option, returns the option from a cache if possible.
+     * @param id The option ID to be retrieved.
+     */
+    getOption(id: string): Promise<undefined | OptionResource>;
+    getAssetTileImageForVariant(variant: VariantResource): Promise<string>;
+    getDefaultVariant(option: OptionResource): VariantResource | undefined;
+    /**
+     * Returns the first variant marked as selected. This is used by most steps.
+     */
+    getSelectedVariant: (option: OptionResource | undefined, selectedVariantIds: string[]) => VariantResource | undefined;
+}
+declare const optionService: OptionService;
+
+declare const setBearerAuthenticationToken: (token: string) => void;
+declare class GraphQlManager {
+    private shadowGraphqlClient;
+    constructor();
+    getShadowGraphqlClient(): ApolloClient<any>;
+    private constructShadowGraphqlClient;
 }
+declare const graphQlManager: GraphQlManager;
 
 interface StorageService {
     /**
@@ -3284,17 +4885,17 @@ declare class IllustrationStepHandle extends StepHandle<IllustrationStepData> {
      * @returns A list of color definitions that are currently applied to the illustration.
      */
     getColors(): {
-        [key: string]: _spiffcommerce_papyrus.ColorDefinition;
+        [key: string]: ColorDefinition;
     } | undefined;
     /**
      * Set color for the illustration.
      */
     setColor(key: string, value: string): Promise<void>;
-    getColorOption(): Promise<_spiffcommerce_papyrus.OptionResource | undefined>;
+    getColorOption(): Promise<OptionResource | undefined>;
     getAvailableColors(): Promise<{
         fill: string | undefined;
         stroke: string | undefined;
-        variant: _spiffcommerce_papyrus.VariantResource;
+        variant: VariantResource;
     }[] | undefined>;
     isColorPickerEnabled(): boolean;
 }
@@ -3367,7 +4968,7 @@ declare class TextStepHandle extends StepHandle<TextStepData> implements CustomC
      */
     clearDefaultTextIfNecessary(): TextChangeResult | undefined;
     hasColorPicker(): boolean | undefined;
-    getRegions(): _spiffcommerce_papyrus.Region[];
+    getRegions(): Region[];
     /**
      * Return the maximum characters allowed for
      * this step, or undefined if there is no limit.
@@ -3480,7 +5081,7 @@ declare class FrameStepHandle extends StepHandle<FrameStepData> {
     constructor(manager: WorkflowManager, step: Step<FrameStepData>, tags: string[]);
     private frameService;
     selectVariant(variant: Variant): Promise<void>;
-    onFrameDataChanged(callback: (frameData: FrameData$1[]) => void): void;
+    onFrameDataChanged(callback: (frameData: FrameData[]) => void): void;
     /**
      * Updates the image selection inside the frame.
      * @param asset The asset to use.
@@ -3504,7 +5105,7 @@ declare class FrameStepHandle extends StepHandle<FrameStepData> {
     removeBackgroundFromImageSelection(applyNewAsset?: boolean): Promise<Asset>;
     changeColors(newFills: Map<string, ColorDefinition>): void;
     getImageData(): PatternImageData | undefined;
-    getColorOption(): Promise<_spiffcommerce_papyrus.OptionResource | undefined>;
+    getColorOption(): Promise<OptionResource | undefined>;
     getAvailableColors(): Promise<ColorOption[]>;
     isColorPickerEnabled(): boolean;
     getOriginalImageColors(): Promise<{
@@ -3512,7 +5113,7 @@ declare class FrameStepHandle extends StepHandle<FrameStepData> {
     } | undefined>;
     getMaxAllowedColors(): number | undefined;
     getUniqueColorCount(): number;
-    getCurrentFrameStep(frameData: FrameData$1, uploading?: any, imageUploadComplete?: any, variants?: VariantResource[]): FrameStep;
+    getCurrentFrameStep(frameData: FrameData, uploading?: any, imageUploadComplete?: any, variants?: VariantResource[]): FrameStep;
     getFrameService(): FrameService | undefined;
     hasOverlayImageKey(): string | undefined;
     hasOverlayImageUrl(): any;
@@ -3557,7 +5158,7 @@ declare class ShapeStepHandle extends StepHandle<ShapeStepData> implements Custo
     getColors(): Promise<{
         fill: string | undefined;
         stroke: string | undefined;
-        variant: _spiffcommerce_papyrus.VariantResource;
+        variant: VariantResource;
     }[]>;
     /**
      * Allows for setting a custom color when the custom variant is selected. Will
@@ -3629,6 +5230,13 @@ declare function findPmsColors(input: string, limit?: number): PmsSearchResult[]
  * @returns
  */
 declare function browserColorToHex(color: string): string;
+/**
+ * Converts a color value found in an SVG file into a color definition. This
+ * logic will split out the browser value eg. "#ffffff" and the spot color value if available eg.
+ * icc-named-color(cub, PANTONE_AAA_100_C)
+ * @param value A color definition based on the data provided in the value.
+ */
+declare const svgColorValueToDefinition: (value: string) => ColorDefinition;
 
 /**
  * The digital content step allows for associating uploaded content with a QR code. This code
@@ -3667,4 +5275,193 @@ declare class ModuleStepHandle extends StepHandle<ModuleStepData> {
     setText(value: string): void;
 }
 
-export { AddonHandle, ArrayInput, AssetNotFoundError, Bundle$1 as Bundle, BundleDesignCreationMessage, BundleEvent, BundleEventData, BundleEventType, CollectionProduct, ColorOption, ColorOptionGlobalPropertyHandle, ConditionalGlobalPropertiesChangedEventData, ConversionConfiguration, ConversionData, ConversionDataType, ConversionLocation, Customer, CustomerDetailsInput, DesignCreationMessage, DesignCreationProgressUpdate, DesignInputStep, DigitalContentStepHandle, EditedSteps, FileUploadGlobalPropertyHandle, FlowExecutionNodeResult, FlowExecutionResult, FlowService, FrameService, FrameStep, FrameStepHandle, FrameThresholdSettings, GetNewWorkflowOptions, GetWorkflowOptions, GlobalPropertyHandle, IllustrationStepHandle, InformationMessageType, InformationResult, InformationStepHandle, Integration, IntegrationProduct, IntegrationType, LayoutNotFoundError, MandatorySteps, MaterialStepHandle, MisconfigurationError, MockWorkflowManager, ModelStepHandle, ModuleStepHandle, NodeType, ObjectInput, ObjectInputType, OptionGlobalPropertyHandle, OptionNotFoundError, ParseError, PictureStepHandle, PmsSearchResult, Product, ProductCameraRig, ProductCollection, ProductWorkflow$1 as ProductWorkflow, promiseCache as PromiseCache, PromiseQueue, QuestionStepHandle, QueueablePromise, RegionElement, RenderableScene, ResourceNotFoundError, SavedDesign, SelectionStorage, ShapeStepHandle, SilentIllustrationStepData, SpiffCommerceClient, Stakeholder, StakeholderType, StateMutationFunc, StepElements, StepHandle, TextChangeResult, TextGlobalPropertyHandle, TextInput, TextStepHandle, TextStepStorage, ToastCallback, Transaction, TransactionShareAction, TransactionShareActionType, Transform, TransformCollection$1 as TransformCollection, UnhandledBehaviorError, Variant, Vector3, WorkflowExperience, WorkflowExperienceEventType, WorkflowExperienceHoverEventData, WorkflowExperienceImpl, WorkflowManager, WorkflowMetadata, WorkflowScene, WorkflowSelections, WorkflowStorage, assetService, browserColorToHex, createDesign, designService, digitalContentStepService, findPmsColors, frameStepService, generateCommands, generateStateFromDesignInputSteps, getBoundedOffsets, getWorkflow, getWorkflows, graphQlManager, illustrationStepService, matchHexToPms, materialStepService, modelStepService, moduleStepService, optionService, persistenceService, pictureStepService, pmsToRgb, questionStepService, rgbToPms, setBearerAuthenticationToken, shapeStepService, shortenUrl, spiffCoreConfiguration, stepAspectValuesToDesignInputSteps, textStepService, toast };
+declare class LayoutElementFactory {
+    static getFrame(layout: LayoutData, opts: {
+        region?: Region;
+        configuration: Partial<FrameStepData>;
+        src?: string;
+    }): Promise<FrameElement>;
+    static getImage(layout: LayoutData, opts: {
+        region?: Region;
+        layout?: LayoutData;
+        configuration: Partial<PictureStepData>;
+        src: string;
+    }): Promise<ImageElement>;
+    static getTextbox(layout: LayoutData, opts: {
+        region?: Region;
+        configuration: Partial<TextStepData>;
+        fontSrc: string;
+        designInputStep?: any;
+    }): Promise<TextboxElement>;
+    static getShape(layout: LayoutData, opts: {
+        region?: Region;
+        color: string;
+    }): Promise<IllustrationElement>;
+    static getIllustration(layout: LayoutData, opts: {
+        region?: Region;
+        src: string;
+    }): Promise<IllustrationElement>;
+}
+
+/**
+ * We use this to register a window in environments where one wouldn't be available.
+ */
+declare function registerWindowImplementation(impl: any): void;
+declare function registerFetchImplementation(impl: (input: RequestInfo | URL, init?: RequestInit) => Promise<Response>): void;
+declare const fetchAsString: (externalUrl: string, allowCache?: boolean) => Promise<string>;
+declare const xmlSerializer: () => XMLSerializer;
+declare const dataUrlFromExternalUrl: (url: string) => Promise<string>;
+declare const svgToDataUrl: (svgString: string) => string;
+
+declare const findElement: <T extends LayoutElement>(id: string, layouts: LayoutState[]) => T;
+declare const rehydrateSerializedLayout: (transactionState: LayoutsState, variationState?: LayoutsState) => Promise<void>;
+
+/**
+ * A map of src to pattern image data.
+ */
+declare const patternImageDataCache: Map<string, PatternImageData>;
+/**
+ * A map of frame path to frame data relevant to that path.
+ */
+declare const frameDataCache: Map<string, FrameData>;
+declare const getFrameData: (frameSvg: string) => Promise<FrameData>;
+/**
+ * Return the dimensions of an SVG string.
+ */
+declare const svgStringDimensions: (svgText: string) => {
+    width: number;
+    height: number;
+};
+
+declare const generate: () => string;
+
+/**
+ * Returns an axis aligned bounding box for a given element.
+ * @param element The element to calculate an AABB for.
+ * @returns The AABB for the element.
+ */
+declare const getAxisAlignedBoundingBox: (x: number, y: number, width: number, height: number, rotation: number) => {
+    minX: number;
+    maxX: number;
+    minY: number;
+    maxY: number;
+};
+declare const findAngle: (a: Point, b: Point, c: Point) => number;
+/**
+ * @param a The first value.
+ * @param b The second value.
+ * @returns Returns true if two values are within a distance to each other.
+ */
+declare const isCloseToValue: (a: number, b: number, allowableDistance: number) => boolean;
+declare const getTrueCoordinates: (point: Point, pointOfRotation: Point, rotation: number) => Point;
+declare const getPointOfRotation: (nwPoint: Point, sePoint: Point) => Point;
+declare const getNWPoint: (bounds: DOMRect, element: LayoutElement, scaleX: number, scaleY: number) => Point;
+declare const getNEPoint: (bounds: DOMRect, element: LayoutElement, scaleX: number, scaleY: number) => Point;
+declare const getSEPoint: (bounds: DOMRect, element: LayoutElement, scaleX: number, scaleY: number) => Point;
+declare const currentDirection: (originalDirection: ScaleAxis, rotation: number) => ScaleAxis;
+/**
+ * Computes helpful values about a rotated element, Useful in calculating updated element locations.
+ * @param element The element to calculate the vertices for.
+ * @returns a, b, c, d starting from top left and moving clockwise. Center represents the point central to
+ * all vertices on thge element.
+ */
+declare const getElementVertices: (element: {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+    rotation: number;
+}, canvasBounds?: Point, scale?: Point) => {
+    a: {
+        x: number;
+        y: number;
+    };
+    b: {
+        x: number;
+        y: number;
+    };
+    c: {
+        x: number;
+        y: number;
+    };
+    d: {
+        x: number;
+        y: number;
+    };
+    center: Point;
+};
+/**
+ * Rotates a point around another point by an angle.
+ * @param p The point to rotate.
+ * @param c The point to rotate around..
+ * @param angleRadians The angle to rotate.
+ * @returns A new point transformed by the rotation.
+ */
+declare const rotateAroundPoint: (p: Point, c: Point, angleRadians: number) => {
+    x: number;
+    y: number;
+};
+
+declare const mmPerPixel = 0.352778;
+declare const cmPerPixel = 0.035277;
+
+declare const sanitizeSvgTree: (root: Element, preserveAspectRatio?: boolean) => void;
+declare const generateSVGWithUnknownColors: (svgBody: string) => Promise<{
+    svg: string;
+    colors: {
+        [key: string]: ColorDefinition;
+    };
+}>;
+
+interface CustomImage {
+    height: number;
+    naturalHeight: number;
+    naturalWidth: number;
+    src: string | ArrayBuffer;
+    width: number;
+}
+interface CustomContext {
+    drawImage(image: CustomCanvas | CustomImage, dx: number, dy: number): void;
+    drawImage(image: CustomCanvas | CustomImage, dx: number, dy: number, dw: number, dh: number): void;
+    drawImage(image: CustomCanvas | CustomImage, sx: number, sy: number, sw: number, sh: number, dx: number, dy: number, dw: number, dh: number): void;
+    rotate(angle: number): void;
+    scale(x: number, y: number): void;
+    translate(x: number, y: number): void;
+}
+interface CustomCanvas {
+    height: number;
+    getContext(type: string): CustomContext | null;
+    toDataURL(): string;
+    toDataURL(type?: string, quality?: number): string;
+    width: number;
+}
+declare const createCanvas: (width?: number, height?: number, type?: "pdf" | "svg") => CustomCanvas;
+declare const loadImage: (src: string | ArrayBuffer, allowCrossOrigin?: boolean) => Promise<CustomImage>;
+interface CustomCanvasModule {
+    createCanvas: typeof createCanvas;
+    loadImage: typeof loadImage;
+}
+declare function setCanvasModule(module?: CustomCanvasModule): void;
+
+declare const getAttributesFromArrayBuffer: (arrayBuffer: ArrayBuffer) => Promise<{
+    dataUrl: string;
+    height: number;
+    width: number;
+}>;
+
+/**
+ * Determine what the font size for a text element should be,
+ * taking autosizing into account.
+ * @Deprecated Old Text system, Transition to new system when Autosizing has been brought across in a way that makes sense.
+ */
+declare const determineCorrectFontSizeAndLines: (curFontSize: number, fontData: FontData, region: Region, linesToBreak: string[], sizeRange: SizeRange) => [number, null | string[], null | number];
+
+/**
+ * A function for loading and caching a font
+ * @param url The URL to load either a web URL or dataURL
+ * @param buffer An optional array buffer for the resource if available
+ * @returns An opentype font object.
+ */
+declare const loadFont: (url: string) => Promise<Font>;
+
+export { AddonHandle, Animatable, AnyStepData, ArrayInput, AspectType, Asset, AssetNotFoundError, AssetObjectVersion, AssetType, BringForwardCommand, BringToBackCommand, BringToFrontCommand, Bundle$1 as Bundle, BundleDesignCreationMessage, BundleEvent, BundleEventData, BundleEventType, CanvasCommand, CollectionProduct, ColorDefinition, ColorOption, ColorOptionGlobalPropertyHandle, ColorProfileProps, CommandContext, CommandState, Condition, ConditionalGlobalPropertiesChangedEventData, ConversionConfiguration, ConversionData, ConversionDataType, ConversionLocation, CreateElementCommand, CreateLayoutCommand, Customer, CustomerDetailsInput, DeleteElementCommand, DesignCreationMessage, DesignCreationProgressUpdate, DesignInputStep, DigitalContentStepData, DigitalContentStepHandle, EditedSteps, FileUploadGlobalPropertyHandle, FlowExecutionNodeResult, FlowExecutionResult, FlowService, FontAlignmentCommand, FontColorCommand, FontSizeCommand, FontSourceCommand, FrameElement, FrameService, FrameStep, FrameStepData, FrameStepHandle, FrameThresholdSettings, GetNewWorkflowOptions, GetWorkflowOptions, GlobalPropertyConfiguration, GlobalPropertyHandle, GroupCommand, ILayout, IllustrationElement, IllustrationStepData, IllustrationStepHandle, ImageElement, InformationMessageType, InformationResult, InformationStepData, InformationStepHandle, Integration, IntegrationOptionResource, IntegrationProduct, IntegrationType, LayoutData, LayoutElement, LayoutElementFactory, LayoutElementType, LayoutNotFoundError, LayoutRenderingPurpose, LayoutState, LayoutsState, MandatorySteps, MaterialEffectMode, MaterialStepData, MaterialStepHandle, MisconfigurationError, MockWorkflowManager, ModelStepData, ModelStepHandle, ModuleStepData, ModuleStepHandle, MoveCommand, NodeType, ObjectInput, ObjectInputType, OptionGlobalPropertyHandle, OptionNotFoundError, OptionResource, PapyrusComponent, ParseError, PictureStepData, PictureStepHandle, Placeable, PmsSearchResult, Point, Product, ProductCameraRig, ProductCollection, ProductWorkflow$1 as ProductWorkflow, promiseCache as PromiseCache, PromiseQueue, QuestionStepData, QuestionStepHandle, QueueablePromise, Region, RegionElement, RenderableScene, ResizeCommand, ResourceNotFoundError, RotateCommand, SavedDesign, ScaleAxis, SelectionStorage, SendBackwardsCommand, ShapeStepData, ShapeStepHandle, SilentIllustrationStepData, SpiffCommerceClient, Stakeholder, StakeholderType, StateMutationFunc, Step, StepAspect, StepAspectType, StepElements, StepGroup, StepHandle, StepStorage, StepType, TextAlgorithm, TextChangeCommand, TextChangeResult, TextGlobalPropertyHandle, TextInput, TextStepData, TextStepHandle, TextStepStorage, TextboxElement, Theme, ToastCallback, Transaction, TransactionShareAction, TransactionShareActionType, Transform, TransformCollection$1 as TransformCollection, UnhandledBehaviorError, UnitOfMeasurement, UpdateImageSourceCommand, Variant, VariantResource, Vector3, Workflow, WorkflowExperience, WorkflowExperienceEventType, WorkflowExperienceHoverEventData, WorkflowExperienceImpl, WorkflowManager, WorkflowMetadata, WorkflowPanel, WorkflowScene, WorkflowSelections, WorkflowStorage, assetService, browserColorToHex, cmPerPixel, createDesign, currentDirection, dataUrlFromExternalUrl, designService, determineCorrectFontSizeAndLines, digitalContentStepService, fetchAsString, findAngle, findElement, findPmsColors, frameDataCache, frameStepService, generate, generateCommands, generateSVGWithUnknownColors, generateStateFromDesignInputSteps, getAttributesFromArrayBuffer, getAxisAlignedBoundingBox, getBoundedOffsets, getElementVertices, getFrameData, getNEPoint, getNWPoint, getPointOfRotation, getSEPoint, getSvgElement, getTrueCoordinates, getWorkflow, getWorkflows, graphQlManager, illustrationStepService, isCloseToValue, loadFont, matchHexToPms, materialStepService, mmPerPixel, modelStepService, moduleStepService, optionService, patternImageDataCache, persistenceService, pictureStepService, pmsToRgb, questionStepService, registerFetchImplementation, registerWindowImplementation, rehydrateSerializedLayout, rgbToPms, rotateAroundPoint, sanitizeSvgTree, setBearerAuthenticationToken, setCanvasModule, shapeStepService, shortenUrl, spiffCoreConfiguration, stepAspectValuesToDesignInputSteps, svgColorValueToDefinition, svgStringDimensions, svgToDataUrl, textStepService, toast, xmlSerializer };