Options

The "Options" component presents users with a catalog of options from which they can pick one or several preferred choices.

This type of component is commonly used for selecting preferences within an app page, providing a simple and intuitive way for users to interact with the system and customize their experience according to their needs and preferences.

Properties settings

Specify the column where user interaction data will be saved in the data table.

This setting is exclusive to the detail page and ensures seamless integration between the Options Input component and the linked data table.

Title

The component will display this label to describe what the user should select. It should be clear and concise so users understand what they are considering the options for.

Available options

Enter your list of options. Separate the options using the comma and press Enter to save the options.

Style

Choose how options in the component are visually presented to users.

Two display options are available: List - displaying the options in the list layout, each option on one row, and Chip - representing options in the form of small, interactive elements resembling physical chips or tokens.

Allow multiple selection

Determines whether the user can select multiple options or just one. The component will display checkboxes instead of radio buttons if multiple selection is allowed.

Hidden

This setting allows the component to be hidden from the user interface. This can be useful when controlling the component's visibility based on specific conditions or user interactions.

Disabled

Configure whether users can change the options by preference or the value will be chosen and fixed by default.

You may consider whether or not disabling the ability to interact with a component in many cases. For instance, you may showcase information in read-only mode, prevent accidental changes to critical data, or disable the component until users go through several steps.

Tag

Name the component for use with the Typescript.

currentPage.components.componentTag

Interactions settings

You can enhance the user experience by designing the system's interaction when your users choose an option from the component. Starion offers a wide range of supported actions, such as updating your table or sending a notification on the interaction.

Explore all the available types of actions and find detailed instructions on their configuration here

pageItem action

Last updated