UNPKG

@aurigma/design-atoms-interfaces

Version:

68 lines (67 loc) 3.23 kB
import { BlendMode } from "./BlendMode"; import { IItemPermissionsData } from "./IItemPermissionsData"; import { ILocationData } from "./ILocationData"; import { IManipulationPermissionsData } from "./IManipulationPermissionsData"; import { IThemeBindingData } from "./IThemeBindingData"; import { IViolationSettings } from "./IViolationSettings"; import { IVisualizationPermissionsData } from "./IVisualizationPermissionsData"; import { WrappingMode } from "./WrappingMode"; /** * A structure containing parameters of custom design elements. * @remarks For details, you can refer to the {@link https://customerscanvas.com/dev/editors/iframe-api/editor-configuration/toolbox.html|Toolbox} topic. * @example * ```js * var configuration = { * angle: 90, * opacity: 0.5, * textWrappingMode: "tight", * themeBinding: { * styles: [ "DimImages" ] * }, * manipulationPermissions: { * allowMoveHorizontal: false, * allowMoveVertical: false * }, * itemPermissions: { * allowZOrderChange: false, * allowOpacityChange: true * } * }; * * CustomersCanvas.IframeApi.loadEditor(iframe, productDefinition, configuration); * ``` * @public */ export interface IItemData { /** A structure defining the manipulation permissions for design elements. */ manipulationPermissions?: IManipulationPermissionsData; /** A structure defining the visualization permissions for design elements. */ visualizationPermissions?: IVisualizationPermissionsData; /** A structure defining the Item Menu and the Floating item toolbar for design elements. */ itemPermissions?: IItemPermissionsData; /** A structure defining the design validation parameters and warnings. */ violationSettings?: IViolationSettings; /** An angle, which design elements are rotated to. By default, this value is `0`. */ angle?: number; /** A wrapping mode that applies to wrap text around design elements, one of `"none"`, `"square"`, or `"tight"`. By default, it is `"none"`. */ textWrappingMode?: WrappingMode; /** An opacity that applies to design elements. This value can be from `0` to `1`. By default, it is `1`. */ opacity?: number; /** The coordinates of design elements being added to the canvas. By default, you can add them to the center of your product. */ location?: ILocationData; /** A style or a color that applies to new design elements. */ themeBinding?: IThemeBindingData; /** The name of design elements being added to the canvas. */ name?: string; /** Marks a design element as a variable item. The default value is `false`. */ isVariable?: boolean; /** The width of design elements being added to the canvas, in points or percent. */ width?: string | number; /** The height of design elements being added to the canvas, in points or percent. For QR codes, the `width` value is used for both `width` and `height`. */ height?: string | number; /** A blend mode that applies to design elements being added to the canvas. */ blendMode?: BlendMode; adjustSize?: boolean; /** Indicates whether the design element is visible on the canvas. The default value is `true`. */ visible?: boolean; }