Weave.js

WeaveExportNodesToolAction

Export the selected nodes as an image

Overview

The WeaveExportNodesToolAction class that allows users to export a specific selection of nodes from the canvas as a standalone image file (e.g., PNG or JPEG). This action is especially useful when users want to extract visual components from the canvas for sharing, documentation, thumbnails, or reuse outside the app.

It works by rendering the selected node(s) to an off-screen canvas, preserving their current visual appearance, and triggering a downloadable export.

The class extends the WeaveAction class.

Name

This action name property value is exportNodesTool.

Import

import { WeaveExportNodesToolAction } from "@inditextech/weave-sdk";

Instantiation

new WeaveExportNodesToolAction();

TypeScript types

const WEAVE_EXPORT_FORMATS: {
  readonly PNG: "image/png";
  readonly JPEG: "image/jpeg";
};

type WeaveExportNodeOptions = {
  format?: typeof WEAVE_EXPORT_FORMATS.PNG;
  padding?: number;
  pixelRatio?: number;
  backgroundColor?: string;
  quality?: number;
};

type WeaveExportNodesActionParams = {
  nodes: WeaveElementInstance[];
  boundingNodes?: (nodes: Konva.Node[]) => Konva.Node[];
  options?: WeaveExportNodesOptions;
  download?: boolean;
};

Trigger function params

trigger(cancelAction: () => void, params?: WeaveExportNodesActionParams): Promise<void>;

For WeaveExportNodesActionParams:

Property Type Required Description

node

WeaveElementInstance

Required

The node instance to export as image.

boundingNodes

(nodes: Konva.Node[]) ⇒ Konva.Node[]

A function that defines the bounding node

options

WeaveExportNodeOptions

The exported image options.

download

boolean

If true, triggers a download, if false, return the image as dataURL

For WeaveExportNodeOptions:

Property Type Required Default Description

format

WeaveExportFormat

Required

WEAVE_EXPORT_FORMATS.PNG

The format of the image to export.

padding

number

0

The padding to add to the image to export. In pixels.

pixelRatio

number

1

The pixel ratio to use on the image to export. For example 2 on a image of 400x400 generates a image of 800x800 pixels.

backgroundColor

string

#FFFFFF

The background color to use on the image to export. Is a CCS color value.

quality

number

1

The quality of the image to export. From 0 to 1.