Skip to main content

Action

type Action =
  { readonly type: "BACK" | "CLOSE" } |
  { readonly type: "URL", url: string } |
  { readonly type: "UPDATE_MEDIA_RUNTIME",
    readonly destinationId: string | null,
    readonly mediaAction:
      | "PLAY"
      | "PAUSE"
      | "TOGGLE_PLAY_PAUSE"
      | "MUTE"
      | "UNMUTE"
      | "TOGGLE_MUTE_UNMUTE"
  } |
  { readonly type: "UPDATE_MEDIA_RUNTIME",
    readonly destinationId?: string | null,
    readonly mediaAction: "SKIP_FORWARD" | "SKIP_BACKWARD"
    readonly amountToSkip: number
  } |
  { readonly type: "UPDATE_MEDIA_RUNTIME",
    readonly destinationId?: string | null,
    readonly mediaAction: "SKIP_TO"
    readonly newTimestamp: number
  } |
  { readonly type: "NODE",
    readonly destinationId: string | null,
    readonly navigation: Navigation,
    readonly transition: Transition | null,
    readonly preserveScrollPosition: boolean,
    readonly overlayRelativePosition?: Vector,
    readonly resetVideoPosition?: boolean,
  }

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.

"UPDATE_MEDIA_RUNTIME" action

This action alters the playing status of all video fills on the destination node. If destinationId is not set, then it will update video fills on the current node.

mediaAction: MediaAction determines

  • "PLAY": Plays the video.
  • "PAUSE": Pauses the video.
  • "TOGGLE_PLAY_PAUSE": Plays the video if it is paused, and pauses the video if it is playing.
  • "MUTE": Mutes the video.
  • "UNMUTE": Unmutes the video.
  • "TOGGLE_MUTE_UNMUTE"`: Mutes the video if it is unmuted, and unmutes the video if it is muted.
  • "SKIP_FORWARD": Jumps forward in time in the video. An amountToSkip must be provided (in seconds).
  • "SKIP_BACKWARD": Jumps backward in time in the video. An amountToSkip must be provided (in seconds).
  • "SKIP_TO": Jumps to a specific timestamp in the video. A newTimestamp must be provided (in seconds).

"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.

resetVideoPosition?: boolean: When true, all videos within the destination frame will reset their memorized playback position to 00:00 before starting to play.

On this page