sdk.objectapi

Home > @kittl/sdk > ObjectAPI

ObjectAPI interface

API for managing design objects, including locking and removal operations.

Signature:

export interface ObjectAPI 

Methods

Method	Description
removeObject(params, opts)	Removes an object from the design canvas and cleans up all associated data This function permanently deletes an object from the design, including: - Removing it from the canvas rendering - Cleaning up the object from the state - Updating any group structures that contain the object - Triggering proper canvas re-rendering **Key Features:** - **Complete Cleanup**: Removes object from all state structures - **Canvas Integration**: Properly removes object from fabric.js canvas - **Group Management**: Updates parent groups and group structures - **State Consistency**: Maintains design state integrity - **History Support**: Operation is tracked for undo/redo functionality **What Gets Removed:** - Object data from the design state - Canvas representation and rendering - References in group structures - Any associated metadata This is a destructive operation that cannot be easily reversed without using the undo functionality. Users should be prompted for confirmation when removing important design elements.
rotateObject(params, opts)	Rotates an object in the design to a specified angle. This function rotates a design object around a specified origin point to the specified angle in degrees. The rotation is applied while maintaining the origin point's visual position, meaning the object will appear to rotate around that point. By default, objects rotate around their center point. **Rotation Behavior:** - **Origin Point**: The object rotates around a configurable origin point (default: center) - **Visual Effect**: The object appears to rotate around the specified origin point - **Angle Parameter**: Accepts both positive and negative angles - **State Management**: Properly updates the design state and patch system **Origin Options:** - **Default**: { x: 'center', y: 'center' } - rotates around the object's center - **Horizontal (x)**: 'left' | 'center' | 'right' - **Vertical (y)**: 'top' | 'center' | 'bottom' - **Common use cases**: - Top-left corner: { x: 'left', y: 'top' } - Bottom-right corner: { x: 'right', y: 'bottom' } - Center: { x: 'center', y: 'center' } (default) **Key Features:** - **Universal Object Support**: Works with all object types using consistent API - **History Integration**: All operations are tracked for undo/redo functionality - **Flexible Origin**: Customize the rotation point for different effects
setHiddenState(params, opts)	Hides or shows an object in the design canvas. When an object is hidden, it is not rendered on the canvas and is invisible to the user. However, the object remains in the design state and can be shown again later.
setLockedState(params, opts)	Locks and unlocks an object in the design, preventing it from being selected, moved, or modified. When an object is locked, it becomes non-interactive in the canvas: - Cannot be selected by clicking or selection tools - Cannot be moved or transformed - Selection controls and handles are hidden - Cannot be edited or modified - Remains visible but is protected from accidental changes This is useful for protecting important design elements like backgrounds, logos, or finalized content while continuing to work on other parts of the design.