Configuration¶
Settings¶
where:
Argument | Description |
---|---|
Id |
Represents the unique identifier of the component. You can use this identifier to refer to this component when building your logic. |
Classes |
Allows applying custom CSS classes to the component. CSS classes define styles that can be used to control the appearance and formatting of the component. Refer to the Extensions topic for more information. |
Display |
Changes the visibility of the component in the application. The value of this property can be changed programmatically by using the Visibility Logic handler, refer to the Data Binding topic for more information. |
Variant |
Allows selecting the appearance style of the Autocomplete Google Places component. Available options are:Standard - The component will have a standard appearance.Filled - The component will have a filled appearance.Outlined - The component will have an outlined appearance. |
Size |
Sets the size of the Autocomplete Google Places component. Available options are:Small - The component will have a small size.Medium - The component will have a medium size. |
Mode |
Specifies the mode in which the Autocomplete Google Places component operates. Available options are:Autocomplete - The component functions as an autocomplete input. The value of this option can be changed programmatically by using the Autocomplete Predictions handler, refer to the Data Binding topic for more information.Search Box - The component functions as a search box for Google Places. The value of this option can be changed programmatically by using the Search Box Predictions handler, refer to the Data Binding topic for more information. |
Label |
Provides a label for the Autocomplete Google Places component. The label is the visible text that describes the purpose of the component. The value of this property can be changed programmatically by using the Label Logic handler, refer to the Data Binding topic for more information. |
Placeholder |
Sets a placeholder text that appears in the input field when it's empty. It provides guidance to users on the type of information they should enter. The value of this property can be changed programmatically by using the Placeholder Logic handler, refer to the Data Binding topic for more information. |
Read Only |
When enabled, this parameter makes the Autocomplete Google Places component read-only. Users won't be able to modify the input content. The value of this property can be changed programmatically by using the Read-Only State Logic handler, refer to the Data Binding topic for more information. |
Disabled |
Disables the Autocomplete Google Places component, preventing users from interacting with it. The value of this property can be changed programmatically by using the Disabled State Logic handler, refer to the Data Binding topic for more information. |
Required |
Indicates whether the component's input is required. If enabled, users must provide input before proceeding. The value of this property can be changed programmatically by using the Required State Logic handler, refer to the Data Binding topic for more information. |
Auto Focus |
Automatically sets the focus on the Autocomplete Google Places component when the page loads, making it convenient for user interaction. |
Flex¶
With Flex settings, you can control how components within a container are positioned, aligned, and distributed.
Icon |
Description |
---|---|
Default alignment of the element. |
|
Aligns to the start of its container. |
|
Aligns to the end of its container. |
|
Stretches to occupy all available space. |
|
Centers within its container. |
Dimension¶
where:
Argument | Description |
---|---|
Width |
Controls the width of the component. Available measurement units are: px , % , vw . |
Min Width |
Prevents the component from changing its width below the specified baseline value. Available measurement units are: px , % , vw . |
Max Width |
Prevents the component from changing its width above the specified baseline value. Available measurement units are: px , % , vw . |
Margin
Both positive and negative values can be utilized within the Margin settings.
where:
Argument | Description |
---|---|
Top |
Defines the space between the top edge of the component and the element above it. In case there is no element above the component, then the top border of the parent container will be used for margin spacing. Increasing the top margin value will create additional space above the component. Available measurement units are: px , % , vh . |
Right |
Controls the space between the right edge of the component and the element to its right. If there is no element to the right of the component, then the right border of the parent container will be used for margin spacing. Adjusting the right margin value increases or decreases the space on the right side of the Text. Available measurement units are: px , % , vw . |
Bottom |
Determines the space between the bottom edge of the component and the element below it. In case there is no element below the component, then the bottom border of the parent container will be used for margin spacing. Increasing the bottom margin value adds space below the component. Available measurement units are: px , % , vh . |
Left |
Sets the space between the left edge of the component and the element to its left. If there is no element to the left of the component, then the left border of the parent container will be used for margin spacing. Modifying the left margin value changes the space on the left side of the component. Available measurement units are: px , % , vw . |