Skip to content

Configuration

Settings

ui_autocomplete_google_places_2

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.

ui_text_4

Icon
Description
ui_text_10
Default alignment of the element.
ui_text_11
Aligns to the start of its container.
ui_text_12
Aligns to the end of its container.
ui_text_13
Stretches to occupy all available space.
ui_text_14
Centers within its container.

Dimension

ui_autocomplete_google_places_3

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.

ui_text_6

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.