@canva/editing-extensions-api-typings

This package contains the TypeScript definitions for creating an editing extension, which is one of the three available types of extensions you can develop for a Canva App.

Note: If you're using JavaScript, you do not need to use this library.

Install

npm:

npm install @canva/editing-extensions-api-typings --save-dev

Yarn:

yarn add @canva/editing-extensions-api-typings --dev

Usage

// Import the types
import {
  CanvaImageBlob,
  ControlName,
} from '@canva/editing-extensions-api-typings';

// Destructure things you need from window.canva object
const { canva } = window;
const { imageHelpers } = canva;

// Initialize the Canva API client
const client = canva.init()

// Render the user's image when the client is ready
client.onReady(async opts => {
  const img = await imageHelpers.toImageElement(opts.image);
  document.body.append(img);
});

Documentation

For the complete editing extension documentation, refer to canva.com/developers/docs/editing-extensions.