Select

Select is a form component that opens the native platform's selection menu and allows users to choose one option from a predefined list. It is typically rendered as a dropdown or picker depending on platform and configuration.

All Form Components should be placed within a Data Zone component set to the Form Data Source.

Settings Panel

All Form Components share the following properties in the Settings Panel:

• ID: Specifies how the data will be named when accessed through its Data Zone. Data for an input will not be accessible until you provide an ID.
• Error: Use this to indicate that a field has an error state. Field errors can be retrieved by referencing the parent Data Zone and inspecting the error property for each field.

Other customizable props include:

• Aria-Level: Defines the hierarchical level of the element for accessibility purposes, assisting screen readers in understanding document structure.
• Default Selection: Specifies which item is selected by default. Provide -1 if no item should be selected initially.
• Error: Use this to indicate that a field has an error state. Field errors can be retrieved by referencing the parent Data Zone and inspecting the error property for each field.
• Hide Dropdown Arrow: When enabled, hides the visual indicator (arrow) that signals the component is a dropdown selector.
• Options: Used to specify the list of items. This can be a Static array (Pictured Above) or derived from available data using the Data Picker. Click the Array Table to add static options.
• Placeholder: Optional text that is displayed when no option has been selected.
• • The color is controlled by Placeholder Text Color in the Appearance Panel.
• Tab Index: Controls the order in which the element receives focus when users navigate using the Tab key.

Appearance Properties (Other)

• Placeholder Text Color: Controls the color and opacity of the placeholder text displayed when no option is selected.
• Display: Controls the layout behavior of the component itself. Options include Block (default) and None (hides the component).
• Elevation: A numeric value that controls the shadow depth on Android and provides a similar shadow effect on iOS and Web.

Interaction Panel Supported Events

Select supports the Standard Event Set:

• On Destroy: Triggers when the component is removed from the layout.
• On Hover In: Triggers when a cursor hovers over the component.
• On Hover Out: Triggers when a cursor leaves the component.
• On Initialize: Triggers when the component is first rendered.
• On Inputs Change: Triggers when any input data changes in the component's context.
• On Long Press: Triggers when the user presses and holds the component.
• On Press: Triggers when the user taps or clicks the component.
• On Press In: Triggers when the user begins pressing the component.
• On Press Out: Triggers when the user releases the press.