Component

This example demonstrates how to work with SketchUp component definitions using the JavaScript SDK.

Prerequisites

The protocol version supports tools (SDK 2.19.0 / Protocol 1.16.0 or later).

Example

Observing Component Instance Changes

Monitor all changes to instances of a specific component, including additions from operations, removals, and changes from undo/redo.

let model = await SketchUpApi.getActiveModel();

// Get a component to monitor
let components = await model.getDefinitions();
if (components.length === 0) {
    console.log('No components available');
    return;
}

let component = components[0];

// Observe all changes to instances of this component
let handle = component.observeInstanceChanges((added, removedIds, source) => {
    console.log(`Added ${added.length} instances`);
    console.log(`Removed ${removedIds.length} instances`);
    console.log(`Source: ${SketchUpApi.ChangeSource[source]}`); // Commit, Undo, or Redo

    // Process added instances
    for (const instance of added) {
        console.log(`New instance: ${instance.name}`);
    }

    // Process removed instances
    if (removedIds.length > 0) {
        console.log(`Removed instance IDs: ${removedIds.join(', ')}`);
    }
});

// Make sure to close the handle when you no longer need the observer
setTimeout(() => handle.stop(), 60 * 1000);