WeaveCopyPasteNodesPlugin
Activate support to copy & paste the nodes
Overview
The WeaveCopyPasteNodesPlugin class that enables copying and pasting nodes within the collaborative canvas environment.
It provides users with familiar keyboard shortcuts:
This plugin improves productivity and usability, especially in complex design, diagramming, or whiteboard-style applications.
The class extends the WeavePlugin class
Name
This plugin name
property value is copyPasteNodes
.
Import
import { WeaveCopyPasteNodesPlugin } from "@inditextech/weave-sdk";
Instantiation
new WeaveCopyPasteNodesPlugin(params?: WeaveCopyPasteNodesPluginParams);
TypeScript types
const WEAVE_COPY_PASTE_PASTE_MODES = {
["INTERNAL"]: "internal",
["EXTERNAL"]: "external",
["NOT_ALLOWED"]: "not-allowed",
["CLIPBOARD_API_ERROR"]: "clipboard-api-error",
["CLIPBOARD_API_NOT_SUPPORTED"]: "clipboard-api-not-supported",
} as const;
const WEAVE_COPY_PASTE_CONFIG_DEFAULT = {
paddingOnPaste: {
enabled: false,
paddingX: 0,
paddingY: 0,
},
} as const;
type WeaveCopyPasteNodesPluginOnCopyEvent = { error?: Error } | undefined;
type WeaveCopyPasteNodesPluginOnPasteEvent = {
error?: Error;
pastedNodes?: string[];
};
type WeaveCopyPasteNodesPluginOnPasteExternalEvent = {
items?: ClipboardItems;
dataList?: DataTransferItemList;
positionCalculated: boolean;
position: Vector2d;
};
type WeaveCopyPastePasteModeKeys = keyof typeof WEAVE_COPY_PASTE_PASTE_MODES;
type WeaveCopyPastePasteMode =
| (typeof WEAVE_COPY_PASTE_PASTE_MODES)[WeaveCopyPastePasteModeKeys]
| undefined;
type WeavePasteModel = {
weaveInstanceId: string;
weave: Record<string, WeaveStateElement>;
weaveMinPoint: Vector2d;
};
type WeaveToPasteNode = {
konvaNode: Konva.Node;
node: NodeSerializable;
};
type PaddingOnPaste = {
enabled: boolean;
paddingX: number;
paddingY: number;
};
type WeaveCopyPasteNodesPluginConfig = {
paddingOnPaste: PaddingOnPaste;
};
type WeaveCopyPasteNodesPluginParams = {
config?: Partial<WeaveCopyPasteNodesPluginConfig>;
};
Parameters
For WeaveCopyPasteNodesPlugin
:
Prop | Type | Default |
---|---|---|
config? | WeaveCopyPasteNodesPluginConfig | - |
For WeaveCopyPasteNodesPluginConfig
:
Prop | Type | Default |
---|---|---|
paddingOnPaste? | PaddingOnPaste | { enabled: false, paddingX: 0, paddingY: 0 } |
Methods
copy
async copy(): void
This method copy the selected nodes to the clipboard.
paste
paste(): void
This method paste onto the stage the contents of the clipboard ir are supported by Weave.js.
getAvailablePasteMode
async getAvailablePasteMode(
canHandleExternal: (items: ClipboardItems) => Promise<boolean>
): Promise<WeaveCopyPastePasteMode>
This method determines the paste mode based on what's on the clipboard.
If there is something on the Weave clipboard (meaning an user copy something on Weave or on other tab)
will return internal
.
If there is something on the clipboard copied from an external site (not a Weave app), it will provide
the clipboard items to the provided callback in order to determine if our app can manage the external
elements on the clipboard, if the callback returns true
then the method will return external
.
If there is nothing on the clipboard (internal or external), the method will return not-allowed
If there is an error using the clipboard API, then the method will return clipboard-api-error
.
If the Clipboard API is no supported
the method will return clipboard-api-not-supported
.
Events
onCopy
onCopy: WeaveCopyPasteNodesPluginOnCopyEvent;
The onCopy
event is called when an user triggered a copy action and the copy finished.
onPaste
onPaste: WeaveCopyPasteNodesPluginOnPasteEvent;
The onPaste
event is called when an user triggered a paste action and the paste finished.
onPasteExternal
onPasteExternal: WeaveCopyPasteNodesPluginOnPasteExternalEvent;
The onPasteExternal
event is called when an user triggers a paste action from elements
external to the actual tab of the browser.