onDesignSelect

Registers a callback that runs when a user selects a design via the "My Designs" carousel.

The "My Designs" carousel only appears if the onDesignSelect callback is registered.

Usage

(async () => {
  const api = await Canva.Partnership.initialize({
    apiKey: "<partner_api_key>",
    autoAuthToken: "<auto_auth_token>",
    container: document.getElementById("container"),
  });

  const onDesignSelect = (opts) => {
    // the user has selected a design via the catalog
    console.log(opts);
  };

  api.showCatalog({
    onDesignSelect,
  });
})();

JAVASCRIPT

Parameters

To understand the meaning of the Volatile column, see the definition of Volatile parameters in the Glossary.

Parameter	Type	Required	Volatile	Description
`opts`	object	Yes	N/A	Information about the selected design.
`opts.designId`	string	Yes	No	The ID of an existing design.
`opts.maxPages`	number	Yes	No	The maximum number of pages a user can print for the design's associated product. The default value is 2.
`opts.partnerProductId`	string	Yes	No	The ID of a product in Canva's back-end. A partner product ID determines the dimensions, the templates, the furniture (if applicable), and the export settings to apply for a design. A partner may provide a partner product ID to Canva beforehand. This may match with a product ID in a partner's back-end, such as SKU or internal system identifier. If partner doesn't provide a partner product ID, Canva assigns one for each product.