Toggling visibility of components

Often it is necessary to show/hide a component based on some customer's input. This can be achieved with visibility_condition.

Visibility condition is using JsonLogic. The available variables within it are input, flags, and all other JsonLogic namespaces. The input variable will contain all of the customer input. For example, input.first_name contains the value of first_name field.

Available Flags

The flags namespace contains system-defined attributes. Important: flags is a top-level namespace, NOT under input.

// Correct
{"var": "flags.editing"}

// Wrong
{"var": "input.flags.editing"}

Common Flags

Flag	Type	Description
editing	boolean	Set to true when the "edit" button is clicked in summary screen
quote_loaded	boolean	Quote request has completed successfully
is_knockout	boolean	Knockout flow has been triggered (quote returned 422)
is_lead	boolean	Customer is entering the application as a lead
is_prefilling	boolean	Customer is entering with data prefilled
active_items	integer	Count of active items
offer_accepted	boolean	Offer flow has been accepted
is_dashboard	boolean	Application is running in dashboard context
policy_purchased	boolean	Policy has been purchased

Payment Flags

Flag	Type	Description
is_3d_secure	boolean	3D Secure flow is active
payment_back	boolean	Returned from payment
payment_tbd	boolean	Payment to be determined
payment_fail	boolean	Payment has failed
payment_success	boolean	Payment was successful

Flow Flags

Flag	Type	Description
is_policy_edit	boolean	Policy edit flow is active
is_mta	boolean	Mid-term adjustment flow is active
is_renewal	boolean	Renewal flow is active
is_recurring_payment_flow	boolean	Recurring payment flow is active

Lead Flags

Flag	Type	Description
lead_token_exists	boolean	Lead token exists
lead_token_valid	boolean	Lead token is valid
lead_retrieved	boolean	Lead data has been retrieved
sales_lead_token_exists	boolean	Sales lead token exists
sales_lead_retrieved	boolean	Sales lead data has been retrieved

FNOL/Claims Flags

Flag	Type	Description
is_fnol_user_logged_in	boolean	FNOL user is logged in
is_claim_edit	boolean	Claim edit flow is active
claim_draft_retrieved	boolean	Claim draft has been retrieved

Other Flags

Flag	Type	Description
can_update_offer	boolean	Offer can be updated
can_purchase_offer	boolean	Offer can be purchased
is_customer_logged_in	boolean	Customer is logged in
is_quote_loading	boolean	Quote request is in progress
is_admin	boolean	Admin mode is active
is_captcha_enabled	boolean	Captcha is enabled
skip_auth	boolean	Skip authentication
is_live_mode	boolean	Application is in live mode
ab_variant	string	A/B test variant identifier

Example visibility condition:

{
  "type": "jsonlogic",
  "schema": {
    "if": [
      {
        "var": "input.data.module_enabled"
      },
      true,
      false
    ]
  }
}

Editing Flow Pattern

When building screens before the summary, it's common to check if the user is in editing mode to redirect them back to summary:

{
  "next": {
    "type": "jsonlogic",
    "schema": {
      "if": [
        {"===": [{"var": "flags.editing"}, true]},
        "summary",
        "next-screen"
      ]
    }
  }
}