What is the difference between a pipeline and a broadcast event?

Pipelines are point-to-point connections between specific ports on specific widgets. Broadcast events are canvas-wide signals that can be heard by any widget listening for that specific event name.

Can I modify data as it moves between two widgets?

Yes, the pipeline system supports transform functions. These are snippets of JavaScript code that modify the 'value' of an event before it reaches the target input port.

How does type compatibility work between widgets?

Connections typically require exact type matches (e.g., number to number). However, the 'any' type is a wildcard that can connect to any other type, and 'trigger' is used for signals without payloads.

How do I debug event flow between widgets?

You can use the StickerNest Debug panel to watch real-time event flow in the 'Events' section or verify active connections in the 'Pipeline' section.

What are ports in the StickerNest pipeline system?

Ports are specific, typed connection points on a widget's manifest. Input ports receive data or signals from other widgets, while output ports emit data or signals to targets.

Connecting Widget Pipelines

Name: Connecting Widget Pipelines
Author: hkcm91

byhkcm91

디자인 도구

Facilitates communication between StickerNest widgets by defining typed ports and configuring data flow pipelines.

소개

This skill provides a standardized framework for architecting complex interactions within the StickerNest canvas by establishing robust communication channels between widgets. It guides developers through defining input and output ports, managing event routing through named pipelines, and ensuring type compatibility across data streams. By leveraging these patterns, users can create highly reactive and interconnected widget ecosystems that support automated data processing, UI synchronization, and canvas-wide event broadcasting with built-in support for transform functions and I/O capability declarations.

주요 기능

Type Compatibility Logic: Utilize automated rules to ensure safe data transfer between matching port types or 'any' wildcards.
0 GitHub stars
Pipeline Orchestration: Configure named collections of connections to manage data flow between multiple widget instances.
Event Broadcasting: Manage canvas-wide signals to synchronize state across all active widgets simultaneously.
Typed Port Definitions: Implement structured input and output ports with specific data types like trigger, string, and object.
Data Transform Functions: Inject custom JavaScript logic directly into connections to modify payloads during transmission.

사용 사례

Connecting UI interaction widgets (like buttons) to trigger actions in backend data-processing widgets.
Implementing global canvas triggers such as theme changes or layout resets that affect every active widget.
Creating complex data transformation chains where output from one widget serves as the input for the next.

소개

주요 기능

Type Compatibility Logic: Utilize automated rules to ensure safe data transfer between matching port types or 'any' wildcards.
0 GitHub stars
Pipeline Orchestration: Configure named collections of connections to manage data flow between multiple widget instances.
Event Broadcasting: Manage canvas-wide signals to synchronize state across all active widgets simultaneously.
Typed Port Definitions: Implement structured input and output ports with specific data types like trigger, string, and object.
Data Transform Functions: Inject custom JavaScript logic directly into connections to modify payloads during transmission.

사용 사례

Connecting UI interaction widgets (like buttons) to trigger actions in backend data-processing widgets.
Implementing global canvas triggers such as theme changes or layout resets that affect every active widget.
Creating complex data transformation chains where output from one widget serves as the input for the next.