@imgly/plugin-cutout-library-web
TypeScript icon, indicating that this package has built-in type declarations

1.0.5 • Public • Published

IMG.LY CE.SDK Plugin Cutouts

This plugin introduces adds cutout functionality to the CreativeEditor SDK. It allows users to add a rectangular or elliptical cutout to the scene. It also allows users to cutout the currently selected shape. It registers a custom asset source called ly.img.cutout which then can be added to the dock. It also adds a custom canvas menu entry when a graphic or text block is selected.

Installation

You can install the plugin via npm or yarn. Use the following commands to install the package:

yarn add @imgly/plugin-cutout-library-web
npm install @imgly/plugin-cutout-library-web

Usage

When adding the plugin to the CE.SDK, you can also add an action button to the canvas menu. Further, we provide a utility method for getting a insert entry for the cutout library that adds the cutout library to the dock.

import CreativeEditorSDK from '@cesdk/cesdk-js';
import CutoutLibraryPlugin from '@imgly/plugin-cutout-library-web';

const cesdk = await CreativeEditorSDK.create(container, config);
await cesdk.addDefaultAssetSources();
await cesdk.addDemoAssetSources({ sceneMode: 'Design' });
await cesdk.addPlugin(
  CutoutLibraryPlugin({
    ui: { locations: ['canvasMenu'] }
  })
);
const cutoutAssetEntry = cesdk.ui.getAssetLibraryEntry('ly.img.cutout.entry');
cesdk.ui.setDockOrder([
  ...cesdk.ui.getDockOrder(),
  {
    id: 'ly.img.assetLibrary.dock',
    label: 'Cutout',
    key: 'ly.img.assetLibrary.dock',
    icon: cutoutAssetEntry?.icon,
    entries: ['ly.img.cutout.entry']
  }
]);

await cesdk.createDesignScene();

/@imgly/plugin-cutout-library-web/

    Package Sidebar

    Install

    npm i @imgly/plugin-cutout-library-web

    Weekly Downloads

    229

    Version

    1.0.5

    License

    SEE LICENSE IN LICENSE.md

    Unpacked Size

    82.7 kB

    Total Files

    16

    Last publish

    Collaborators

    • danielhauschildt
    • keiwando
    • schiewe
    • sascha_
    • svendvd
    • leon_dud
    • mirko314-imgly
    • maerch
    • ravenszewczyk-imgly
    • elia-darwish
    • maltebaumann
    • hiyeon