The Connection.Triggers.Authorize component handles the connection authorization flow. It provides:

  • Custom authorization UI integration
  • Popup and redirect authorization modes
  • Comprehensive callback system
  • Connection state management
  • Automatic popup window handling

​
Installation

yarn add @runmorph/atoms

​
Usage

"use client"
import { Connection } from "@runmorph/atoms";
import { Button } from "@/components/ui/button";

function CustomConnectButton({ sessionToken }) {
    return (
        <Connection.Triggers.Authorize sessionToken={sessionToken}>
            <Button>Connect Account</Button>
        </Connection.Triggers.Authorize>
    );
}

export default CustomConnectButton;

​
Props

​
children
ReactElement
required

A valid React element that will trigger the authorization action. Must accept onClick and onKeyDown event handlers.

​
sessionToken
string
required

A session token for the connection. Can be provided via props or through a Connection.Provider context.

​
windowMode
popup|redirect
default:"popup"

Determines how the authorization window is opened: - popup: Opens in a new window (default) - redirect: Redirects the current window

​
mode
direct|connect
default:"connect"

The connection mode to use: - connect: Standard OAuth connection flow - direct: Direct connection without OAuth

​
redirectUrl
string

The URL where the user will be redirected after authorization. Required when windowMode is set to redirect.

​
settings
object

Additional settings to pass to the connection authorization flow.

​
connectionCallbacks
object

When using windowMode="popup", the component:

  1. Checks if popups are allowed
  2. Centers the popup window on screen
  3. Uses standard dimensions (600x800)
  4. Monitors popup state
  5. Handles connection status updates

Default popup configuration:

{
  width: 600,
  height: 800,
  centered: true,
  pollInterval: 1000 // ms
}

​
Internationalization

The component supports internationalization for error messages through:

  • triggers.authorize.errors.missingToken
  • triggers.authorize.errors.missingMethod
  • triggers.authorize.errors.popupBlocked
  • triggers.authorize.errors.noAuthUrl
  • triggers.authorize.errors.invalidChildren