Skip to main content


type Action =
{ readonly type: "BACK" | "CLOSE" } |
{ readonly type: "URL", url: string } |
{ readonly type: "NODE",
readonly destinationId: string | null,
readonly navigation: Navigation,
readonly transition: Transition | null,
readonly preserveScrollPosition: boolean,
readonly overlayRelativePosition?: Vector,

type Navigation = "NAVIGATE" | "SWAP" | "OVERLAY" | "SCROLL_TO" | "CHANGE_TO"

A prototyping Action describes interactivity in prototypes. Specifically, "what happens?" upon a Trigger.

"BACK" action

This action navigates to the previously opened frame by popping the navigation history.

"CLOSE" action

This action closes the current topmost overlay (applicable only on overlays).

"URL" action

This action opens an external URL specified in the url: string parameter.

"NODE" action

This action navigates to a new node.

destinationId: string | null: The ID of the destination node being navigated to. This may be null when invalid (e.g. points to a deleted node).

navigation: Navigation: The method of navigation. The possible values are:

  • "NAVIGATE": Replaces the current screen with the destination, also closing all overlays.
  • "OVERLAY": Opens the destination as an overlay on the current screen.
  • "SWAP": On an overlay, replaces the current (topmost) overlay with the destination. On a top-level frame, behaves the same as "NAVIGATE" except that no entry is added to the navigation history.
  • "SCROLL_TO": Scrolls to the destination on the current screen.
  • "CHANGE_TO": Changes the closest ancestor instance of source node to the specified variant.

transition: Transition | null: An animated transition when navigating, if any. See the Transition object type.

preserveScrollPosition: boolean: Whether the scroll offsets of any scrollable elements in the current screen or overlay are preserved when navigating to the destination. This is applicable only if the layout of both the current frame and its destination are the same.

overlayRelativePosition?: Vector: Applicable only when navigation is "OVERLAY" and the destination is a frame with overlayPosition equal to "MANUAL". This value represents the offset by which the overlay is opened relative to this node.