Links

Component Info screen

The Component Info screen is a searchable popup that contains descriptions of each component and its properties. You can use this screen to learn more about components and add them to your application.
Note: You can only access the Component Info screen in the Design and Logic views.
This page outlines how to:
Component Info Screen

Access the Component Info screen

There are three ways to access the Component Info screen:

Use the shortcut

To access the Component Info screen with the keyboard shortcut:
  1. 1.
    Open an application.
  2. 2.
    Click Design or Logic to enter the corresponding workspace view.
  3. 3.
    Press the following keys to open the Component Info screen:
    • CMD + K (Mac)
    • CTRL + K (Windows)

Select a component tile

When you click a component tile in the Libraries panel, a preview of the Component Info screen opens beside the component. This preview contains descriptions of the selected component and its properties.

Right-click a UI component

To open a component's Component Info screen in the Design view:
  1. 1.
    Locate a component you want to learn more about.
  2. 2.
    Right-click the component.
  3. 3.
    Select View Component Info.
  4. 4.
    The Component Info screen opens on the selected component's page.

Use the Component Info Screen

This section provides information on using the Component Info screen. The following sections outline how to:

View component descriptions and properties

To view component descriptions and properties in the Component Info screen:
  1. 1.
    Open the Component Info screen.
  2. 2.
    Locate the component you want to view in the left-side catalog or search for it using the top search bar.
  3. 3.
    Select the desired component to view its description.
  4. 4.
    To learn more about a component's properties, select one of the following tabs:
    • Style: Contains descriptions of each of the component's default style properties (e.g. backdropColor).
    • State: Contains descriptions of each of the component's default state properties (e.g. disabled or type).
    • Action: Contains descriptions of each of the component's default action properties (e.g. onClick).
    Note: Some components do not have tabs for each type of property.

Add components to your app

To add a component to your application from the Component Info screen:
  1. 1.
    Navigate to the component's page in the Component Info screen.
  2. 2.
    Click Insert Component to add it to your application.
    Note: For more information, see UI configuration options.