Variables:

• ClassSufix: Send a suffix to use multiple CSS personalizations. The suffix sent will generate all the existing CSS classes with the "-suffix" in the end.
  For example: if sent the suffix "base" the classes added will be:
  • adds-main -> adds-main-base
  • adds-combobox  -> adds-combobox-base
  • The same for all other classes

• ItemList: List of items to show in the dropdown.

• SelectedItemsList: Use this parameter to set pre-selected items.
  
  
• SelectItemsMatchType: If a list of pre-selected items is sent, use this variable to set how the search is done:
  • 0 (default): Exact match of value and text.
  • 1: Match of value only.
  • 2: Match of text only.
  • 3: Try full match first, then value, and at last text.
  • 4: Try full match first, then text, and at last value.
    
    
• PromptText: Text to be shown when no value is selected.
  Default value: "Select an item"
  
  
• SearchText: Text to display on the search bar.
  Default value: "Search"
  
  
• SelectedText: Text to display after selecting more than the max Items allowed.
  Example: "7 selected".
  Default value: "selected"
  
  
• FixedSelectedText: If you need to display a specific text after the max number of selected items is reached set the variable "IsToUseFixSelectedText" to True and add here the text to be displayed.
  
  
• AllText: Text to display on the checkbox "All" used to select or deselect all items found.
  Default value: "All"
  
  
• EmptyText: Text to display if the search doesn't return any item.
  Default value: "No item to show"
  
  
• MaxItemsToDisplay: Use this variable to set the number of items to be displayed at once (size of the dropdown).
  Default value: 5
  
  
• MaxItems: Maximum of Items to be listed as selected.
  Example: Selected [Apple, Avocado, Banana, Orange]
  MaxItems = 5 -> "Apple, Avocado, Banana, Orange"
  MaxItems = 3 -> "4 selected"
  Default value: 3
  
  
• MaxTextSize: Maximum of character to show in the selected Items text. If the size is bigger add "..." at the end.
  Example: Selected [Apple, Avocado, Banana, Orange]
  MaxTextSize = 200 -> "Apple, Avocado, Banana, Orange"
  MaxTextSize = 20 -> "Apple, Avocado, Bana..."
  Default value: 100
  
  
• DropDownLimit: To improve performance set a value to limit the maximum of items to be displayed in the dropdown at once.
  By default, the dropdown doesn't have a limit of items to show, so the default value is 0.
  
  
• DropDownLimitPrepositionText: If a limit was set for the max number of items to be displayed in the dropdown when the search returns more items than the limit a text will be displayed informing the number of items displayed and the total number of items found.
  The text has the pattern: (# preposition # description), like "(50 of 267 items)".
  Use this variable to set the preposition of the phrase.
  Default value: "of"
  
  
• DropDownLimitDescriptionText: If a limit was set for the max number of items to be displayed in the dropdown when the search returns more items than the limit a text will be displayed informing the number of items displayed and the total number of items found.
  The text has the pattern: (# preposition # description), like "(50 of 267 items)".
  Use this variable to set the description of the phrase.
  Default value: "items"
  
  
• PromptTextColor: Color of the text shown when no value is selected.
  Default value: "var(--color-neutral-7)"
  
  
• ListTextColor: Color of the text shown when a value is selected.
  Default value: "var(--color-neutral-10)"
  
  
• MenuTextColor: Color of the text on the dropdown items.
  Default value: "#4F575E"
  
  
• DisableColor: Color of the background when disabled.
  Default value: "#FFFFFF"
  
  
• IsMultipleSelection: If you want the block to become a standard dropdown (only one selection) set this variable as False.
  
  
• IsToShowSelectAll: If you want to hide the select all option set this variable as False.
  
  
• IsSearchable: If you want the block to become a standard dropdown (no search field) set this variable as False.
  
  
• IsToShowCounterTag: Set to true if the dropdown should present a counter tag if the number of selected items is greater than the MaxItems set.
  
  
• IsToUseFixSelectedText: Set this option to true if you need the selected text to be set. Use the variable "FixedSelectedText" to choose the text to display. If nothing were sent the text will be the first option selected in the dropdown.
  This option can be used for example if the counter tag is active and the full list of selected options is irrelevant, being presented only the total number of selections and the first selected item.
  
  
• Enable: Set as False to disable the DropdownSearch.
  
  
• ReturnAll: If the return should be all the Items and not just the selected ones set as True.
  Default value: False

CSS Classes:

/* Main container of the Advanced DropDown Search, includes all elements */

.adds-main {}

/* Edit the tag that appears if elements were selected */

.tag {}

.tag-text {}

/* Main container of the Combobox, use it to set external borders for example */

.adds-combobox {}

.adds-combobox-prompt {}

.adds-combobox-selected {}

/* Internal container of the Combobox */

.adds-combobox-internal {}

/* Style the prompt text */

.adds-prompt {}

/* Style the selected items text */

.adds-selected {}

/* Main container of the Combobox, use it to set external borders for example */

.adds-chevron {}

/* This class is used to open the dropdown if clicked on the chevron. Add this class to your personalized icon if the icon were changed */

.adds-chevron-down {}

.adds-combobox-selected {}

/* Main container of the list, includes the search box and the list itself */

.adds-main-list {}

/* Wrapper container of the input search */

.adds-search-wrapper {}

/* Input search itself */

.adds-input-search {}

/* External container of the empty search with the class choices__list */

.adds-empty-list {}

/* Internal container of the empty search with the class ItemList choices__item */

.adds-empty-item {}

/* Style the empty search text */

.adds-empty {}

/* External container of the search list with the class choices__list */

.adds-search-list {}

/* Container with the select all item of the list with the classes ItemList and choices__list */

.adds-list-item-all {}

/* Container with the item of the list with the classes ItemList and choices__list */

.adds-list-item {}

/* To change the select all checkbox style with the class checkbox also */

.adds-checkbox-all {}

/* To change the checkbox style with the class checkbox also */

.adds-checkbox {}

/* Style the select all item text */

.adds-item-all {}

/* Style the item text */

.adds-item {}

/* List of searched items with the classes list and list-group */

.adds-item-list {}

OBS: Due to OutSystems limitations it's important to use !important in this CSS classes

Last documentation update: 28/08/2022

Variables:

• ClassSufix: Send a suffix to use multiple CSS personalizations. The suffix sent will generate all the existing CSS classes with the "-suffix" in the end.
  For example: if sent the suffix "base" the classes added will be:
  • adds-main -> adds-main-base
  • adds-combobox  -> adds-combobox-base
  • The same for all other classes

• ItemList: List of items to show in the dropdown.

• SelectedItemsList: Use this parameter to set pre-selected items.
  
  
• SelectItemsMatchType: If a list of pre-selected items is sent, use this variable to set how the search is done:
  • 0 (default): Exact match of value and text.
  • 1: Match of value only.
  • 2: Match of text only.
  • 3: Try full match first, then value, and at last text.
  • 4: Try full match first, then text, and at last value.
    
    
• PromptText: Text to be shown when no value is selected.
  Default value: "Select an item"
  
  
• SearchText: Text to display on the search bar.
  Default value: "Search"
  
  
• SelectedText: Text to display after selecting more than the max Items allowed.
  Example: "7 selected".
  Default value: "selected"
  
  
• FixedSelectedText: If you need to display a specific text after the max number of selected items is reached set the variable "IsToUseFixSelectedText" to True and add here the text to be displayed.
  
  
• AllText: Text to display on the checkbox "All" used to select or deselect all items found.
  Default value: "All"
  
  
• EmptyText: Text to display if the search doesn't return any item.
  Default value: "No item to show"
  
  
• MaxItemsToDisplay: Use this variable to set the number of items to be displayed at once (size of the dropdown).
  Default value: 5
  
  
• MaxItems: Maximum of Items to be listed as selected.
  Example: Selected [Apple, Avocado, Banana, Orange]
  MaxItems = 5 -> "Apple, Avocado, Banana, Orange"
  MaxItems = 3 -> "4 selected"
  Default value: 3
  
  
• MaxTextSize: Maximum of character to show in the selected Items text. If the size is bigger add "..." at the end.
  Example: Selected [Apple, Avocado, Banana, Orange]
  MaxTextSize = 200 -> "Apple, Avocado, Banana, Orange"
  MaxTextSize = 20 -> "Apple, Avocado, Bana..."
  Default value: 100
  
  
• DropDownLimit: To improve performance set a value to limit the maximum of items to be displayed in the dropdown at once.
  By default, the dropdown doesn't have a limit of items to show, so the default value is 0.
  
  
• DropDownLimitPrepositionText: If a limit was set for the max number of items to be displayed in the dropdown when the search returns more items than the limit a text will be displayed informing the number of items displayed and the total number of items found.
  The text has the pattern: (# preposition # description), like "(50 of 267 items)".
  Use this variable to set the preposition of the phrase.
  Default value: "of"
  
  
• DropDownLimitDescriptionText: If a limit was set for the max number of items to be displayed in the dropdown when the search returns more items than the limit a text will be displayed informing the number of items displayed and the total number of items found.
  The text has the pattern: (# preposition # description), like "(50 of 267 items)".
  Use this variable to set the description of the phrase.
  Default value: "items"
  
  
• PromptTextColor: Color of the text shown when no value is selected.
  Default value: "var(--color-neutral-7)"
  
  
• ListTextColor: Color of the text shown when a value is selected.
  Default value: "var(--color-neutral-10)"
  
  
• MenuTextColor: Color of the text on the dropdown items.
  Default value: "#4F575E"
  
  
• DisableColor: Color of the background when disabled.
  Default value: "#FFFFFF"
  
  
• IsMultipleSelection: If you want the block to become a standard dropdown (only one selection) set this variable as False.
  
  
• IsToShowSelectAll: If you want to hide the select all option set this variable as False.
  
  
• IsSearchable: If you want the block to become a standard dropdown (no search field) set this variable as False.
  
  
• IsToShowCounterTag: Set to true if the dropdown should present a counter tag if the number of selected items is greater than the MaxItems set.
  
  
• IsToUseFixSelectedText: Set this option to true if you need the selected text to be set. Use the variable "FixedSelectedText" to choose the text to display. If nothing were sent the text will be the first option selected in the dropdown.
  This option can be used for example if the counter tag is active and the full list of selected options is irrelevant, being presented only the total number of selections and the first selected item.
  
  
• Enable: Set as False to disable the DropdownSearch.
  
  
• ReturnAll: If the return should be all the Items and not just the selected ones set as True.
  Default value: False

CSS Classes:

/* Main container of the Advanced DropDown Search, includes all elements */

.adds-main {}

/* Edit the tag that appears if elements were selected */

.tag {}

.tag-text {}

/* Main container of the Combobox, use it to set external borders for example */

.adds-combobox {}

.adds-combobox-prompt {}

.adds-combobox-selected {}

/* Internal container of the Combobox */

.adds-combobox-internal {}

/* Style the prompt text */

.adds-prompt {}

/* Style the selected items text */

.adds-selected {}

/* Main container of the Combobox, use it to set external borders for example */

.adds-chevron {}

/* This class is used to open the dropdown if clicked on the chevron. Add this class to your personalized icon if the icon were changed */

.adds-chevron-down {}

.adds-combobox-selected {}

/* Main container of the list, includes the search box and the list itself */

.adds-main-list {}

/* Wrapper container of the input search */

.adds-search-wrapper {}

/* Input search itself */

.adds-input-search {}

/* External container of the empty search with the class choices__list */

.adds-empty-list {}

/* Internal container of the empty search with the class ItemList choices__item */

.adds-empty-item {}

/* Style the empty search text */

.adds-empty {}

/* External container of the search list with the class choices__list */

.adds-search-list {}

/* Container with the select all item of the list with the classes ItemList and choices__list */

.adds-list-item-all {}

/* Container with the item of the list with the classes ItemList and choices__list */

.adds-list-item {}

/* To change the select all checkbox style with the class checkbox also */

.adds-checkbox-all {}

/* To change the checkbox style with the class checkbox also */

.adds-checkbox {}

/* Style the select all item text */

.adds-item-all {}

/* Style the item text */

.adds-item {}

/* List of searched items with the classes list and list-group */

.adds-item-list {}

OBS: Due to OutSystems limitations it's important to use !important in this CSS classes

Last documentation update: 28/08/2022

Variables:

• ClassSufix: Send a suffix to use multiple CSS personalizations. The suffix sent will generate all the existing CSS classes with the "-suffix" in the end.
  For example: if sent the suffix "base" the classes added will be:
  • adds-main -> adds-main-base
  • adds-combobox  -> adds-combobox-base
  • The same for all other classes

• ItemList: List of items to show in the dropdown.

• SelectedItemsList: Use this parameter to set pre-selected items.
  
  
• SelectItemsMatchType: If a list of pre-selected items is sent, use this variable to set how the search is done:
  • 0 (default): Exact match of value and text.
  • 1: Match of value only.
  • 2: Match of text only.
  • 3: Try full match first, then value, and at last text.
  • 4: Try full match first, then text, and at last value.
    
    
• PromptText: Text to be shown when no value is selected.
  Default value: "Select an item"
  
  
• SearchText: Text to display on the search bar.
  Default value: "Search"
  
  
• SelectedText: Text to display after selecting more than the max Items allowed.
  Example: "7 selected".
  Default value: "selected"
  
  
• FixedSelectedText: If you need to display a specific text after the max number of selected items is reached set the variable "IsToUseFixSelectedText" to True and add here the text to be displayed.
  
  
• AllText: Text to display on the checkbox "All" used to select or deselect all items found.
  Default value: "All"
  
  
• EmptyText: Text to display if the search doesn't return any item.
  Default value: "No item to show"
  
  
• MaxItemsToDisplay: Use this variable to set the number of items to be displayed at once (size of the dropdown).
  Default value: 5
  
  
• MaxItems: Maximum of Items to be listed as selected.
  Example: Selected [Apple, Avocado, Banana, Orange]
  MaxItems = 5 -> "Apple, Avocado, Banana, Orange"
  MaxItems = 3 -> "4 selected"
  Default value: 3
  
  
• MaxTextSize: Maximum of character to show in the selected Items text. If the size is bigger add "..." at the end.
  Example: Selected [Apple, Avocado, Banana, Orange]
  MaxTextSize = 200 -> "Apple, Avocado, Banana, Orange"
  MaxTextSize = 20 -> "Apple, Avocado, Bana..."
  Default value: 100
  
  
• DropDownLimit: To improve performance set a value to limit the maximum of items to be displayed in the dropdown at once.
  By default, the dropdown doesn't have a limit of items to show, so the default value is 0.
  
  
• DropDownLimitPrepositionText: If a limit was set for the max number of items to be displayed in the dropdown when the search returns more items than the limit a text will be displayed informing the number of items displayed and the total number of items found.
  The text has the pattern: (# preposition # description), like "(50 of 267 items)".
  Use this variable to set the preposition of the phrase.
  Default value: "of"
  
  
• DropDownLimitDescriptionText: If a limit was set for the max number of items to be displayed in the dropdown when the search returns more items than the limit a text will be displayed informing the number of items displayed and the total number of items found.
  The text has the pattern: (# preposition # description), like "(50 of 267 items)".
  Use this variable to set the description of the phrase.
  Default value: "items"
  
  
• PromptTextColor: Color of the text shown when no value is selected.
  Default value: "var(--color-neutral-7)"
  
  
• ListTextColor: Color of the text shown when a value is selected.
  Default value: "var(--color-neutral-10)"
  
  
• MenuTextColor: Color of the text on the dropdown items.
  Default value: "#4F575E"
  
  
• DisableColor: Color of the background when disabled.
  Default value: "#FFFFFF"
  
  
• IsMultipleSelection: If you want the block to become a standard dropdown (only one selection) set this variable as False.
  
  
• IsToShowSelectAll: If you want to hide the select all option set this variable as False.
  
  
• IsSearchable: If you want the block to become a standard dropdown (no search field) set this variable as False.
  
  
• IsToShowCounterTag: Set to true if the dropdown should present a counter tag if the number of selected items is greater than the MaxItems set.
  
  
• IsToUseFixSelectedText: Set this option to true if you need the selected text to be set. Use the variable "FixedSelectedText" to choose the text to display. If nothing were sent the text will be the first option selected in the dropdown.
  This option can be used for example if the counter tag is active and the full list of selected options is irrelevant, being presented only the total number of selections and the first selected item.
  
  
• Enable: Set as False to disable the DropdownSearch.
  
  
• ReturnAll: If the return should be all the Items and not just the selected ones set as True.
  Default value: False

CSS Classes:

/* Main container of the Advanced DropDown Search, includes all elements */

.adds-main {}

/* Edit the tag that appears if elements were selected */

.tag {}

.tag-text {}

/* Main container of the Combobox, use it to set external borders for example */

.adds-combobox {}

.adds-combobox-prompt {}

.adds-combobox-selected {}

/* Internal container of the Combobox */

.adds-combobox-internal {}

/* Style the prompt text */

.adds-prompt {}

/* Style the selected items text */

.adds-selected {}

/* Main container of the Combobox, use it to set external borders for example */

.adds-chevron {}

/* This class is used to open the dropdown if clicked on the chevron. Add this class to your personalized icon if the icon were changed */

.adds-chevron-down {}

.adds-combobox-selected {}

/* Main container of the list, includes the search box and the list itself */

.adds-main-list {}

/* Wrapper container of the input search */

.adds-search-wrapper {}

/* Input search itself */

.adds-input-search {}

/* External container of the empty search with the class choices__list */

.adds-empty-list {}

/* Internal container of the empty search with the class ItemList choices__item */

.adds-empty-item {}

/* Style the empty search text */

.adds-empty {}

/* External container of the search list with the class choices__list */

.adds-search-list {}

/* Container with the select all item of the list with the classes ItemList and choices__list */

.adds-list-item-all {}

/* Container with the item of the list with the classes ItemList and choices__list */

.adds-list-item {}

/* To change the select all checkbox style with the class checkbox also */

.adds-checkbox-all {}

/* To change the checkbox style with the class checkbox also */

.adds-checkbox {}

/* Style the select all item text */

.adds-item-all {}

/* Style the item text */

.adds-item {}

/* List of searched items with the classes list and list-group */

.adds-item-list {}

OBS: Due to OutSystems limitations it's important to use !important in this CSS classes

Last documentation update: 28/08/2022

Variables:

• ItemList: List of items to show in the dropdown.
  
  
• SelectedItemsList: Use this parameter to set pre-selected items.
  
  
• SelectItemsMatchType: If a list of pre-selected items is sent, use this variable to set how the search id is done:
  • 0 (default): Exact match of value and text.
  • 1: Match of value only.
  • 2: Match of text only.
  • 3: Try full match first, then value, and at last text.
  • 4: Try full match first, then text, and at last value.
    
    
• PromptText: Text to be shown when no value is selected.
  Default value: "Select an item"
  
  
• SearchText: Text to display on the search bar.
  Default value: "Search"
  
  
• SelectedText: Text to display after selecting more than the max Items allowed.
  Example: "7 selected".
  Default value: "selected"
  
  
• FixedSelectedText: If you need to display a specific text after the max number of selected items is reached set the variable "IsToUseFixSelectedText" to True and add here the text to be displayed.
  
  
• AllText: Text to display on the checkbox "All" used to select or deselect all items found.
  Default value: "All"
  
  
• EmptyText: Text to display if the search doesn't return any item.
  Default value: "No item to show"
  
  
• MaxItemsToDisplay: Use this variable to set the number of items to be displayed at once (size of the dropdown).
  Default value: 5
  
  
• MaxItems: Maximum of Items to be listed as selected.
  Example: Selected [Apple, Avocado, Banana, Orange]
  MaxItems = 5 -> "Apple, Avocado, Banana, Orange"
  MaxItems = 3 -> "4 selected"
  Default value: 3
  
  
• MaxTextSize: Maximum of character to show in the selected Items text. If the size is bigger add "..." at the end.
  Example: Selected [Apple, Avocado, Banana, Orange]
  MaxTextSize = 200 -> "Apple, Avocado, Banana, Orange"
  MaxTextSize = 20 -> "Apple, Avocado, Bana..."
  Default value: 100
  
  
• DropDownLimit: To improve performance set a value to limit the maximum of items to be displayed in the dropdown at once.
  By default, the dropdown doesn't have a limit of items to show, so the default value is 0.
  
  
• DropDownLimitPrepositionText: If a limit was set for the max number of items to be displayed in the dropdown when the search returns more items than the limit a text will be displayed informing the number of items displayed and the total number of items found.
  The text has the pattern: (# preposition # description), like "(50 of 267 items)".
  Use this variable to set the preposition of the phrase.
  Default value: "of"
  
  
• DropDownLimitDescriptionText: If a limit was set for the max number of items to be displayed in the dropdown when the search returns more items than the limit a text will be displayed informing the number of items displayed and the total number of items found.
  The text has the pattern: (# preposition # description), like "(50 of 267 items)".
  Use this variable to set the description of the phrase.
  Default value: "items"
  
  
• PromptTextColor: Color of the text shown when no value is selected.
  Default value: "var(--color-neutral-7)"
  
  
• ListTextColor: Color of the text shown when a value is selected.
  Default value: "var(--color-neutral-10)"
  
  
• MenuTextColor: Color of the text on the dropdown items.
  Default value: "#4F575E"
  
  
• DisableColor: Color of the background when disabled.
  Default value: "#FFFFFF"
  
  
• IsMultipleSelection: If you want the block to become a standard dropdown (only one selection) set this variable as False.
  
  
• IsToShowSelectAll: If you want to hide the select all option set this variable as False.
  
  
• IsSearchable: If you want the block to become a standard dropdown (no search field) set this variable as False.
  
  
• IsToShowCounterTag: Set to true if the dropdown should present a counter tag if the number of selected Items is greater than the MaxItems set.
  
  
• IsToUseFixSelectedText: Set this option to true if you need the selected text to be set. Use the variable "FixedSelectedText" to choose the text to display. If nothing were sent the text will be the first option selected in the dropdown.
  This option can be used for example if the counter tag is active and the full list of selected options is irrelevant, being presented only the total number of selections and the first selected item.
  
  
• Enable: Set as False to disable the DropdownSearch.
  
  
• ReturnAll: If the return should be all the Items and not just the selected ones set as True.
  Default value: False

CSS Classes:

/* Main container of the Advanced DropDown Search, includes all elements */

.adds-main {}

/* Edit the tag that appears if elements were selected */

.tag {}

.tag-text {}

/* Main container of the Combobox, use it to set external borders for example */

.adds-combobox {}

.adds-combobox-prompt {}

.adds-combobox-selected {}

/* Internal container of the Combobox */

.adds-combobox-internal {}

/* Style the prompt text */

.adds-prompt {}

/* Style the selected items text */

.adds-selected {}

/* Main container of the Combobox, use it to set external borders for example */

.adds-chevron {}

/* This classe is used to open the dropdown if clicked on the chevron. Add this class to your personalized icon if the icon were changed */

.adds-chevron-down {}

.adds-combobox-selected {}

/* Main container of the list, includes the search box and the list itself */

.adds-main-list {}

/* Wrapper container of the input search */

.adds-search-wrapper {}

/* Input search itself */

.adds-input-search {}

/* External container of the empty search with the class choices__list */

.adds-empty-list {}

/* Internal container of the empty search with the class ItemList choices__item */

.adds-empty-item {}

/* Style the empty search text */

.adds-empty {}

/* External container of the search list with the class choices__list */

.adds-search-list {}

/* Container with the select all item of the list with the classes ItemList and choices__list */

.adds-list-item-all {}

/* Container with the item of the list with the classes ItemList and choices__list */

.adds-list-item {}

/* To change the select all checkbox style with the class checkbox also */

.adds-checkbox-all {}

/* To change the checkbox style with the class checkbox also */

.adds-checkbox {}

/* Style the select all item text */

.adds-item-all {}

/* Style the item text */

.adds-item {}

/* List of searched items with the classes list and list-group */

.adds-item-list {}

OBS: Due to OutSystems limitations it's important to use !important in this CSS classes

Last documentation update: 19/07/2022

Variables:

• ItemList: List of items to show in the dropdown.
  
  
• SelectedItemsList: Use this parameter to set pre-selected items.
  
  
• SelectItemsMatchType: If a list of pre-selected items is sent, use this variable to set how the search id is done:
  • 0 (default): Exact match of value and text.
  • 1: Match of value only.
  • 2: Match of text only.
  • 3: Try full match first, then value, and at last text.
  • 4: Try full match first, then text, and at last value.
    
    
• PromptText: Text to be shown when no value is selected.
  Default value: "Select an item"
  
  
• SearchText: Text to display on the search bar.
  Default value: "Search"
  
  
• SelectedText: Text to display after selecting more than the max Items allowed.
  Example: "7 selected".
  Default value: "selected"
  
  
• FixedSelectedText: If you need to display a specific text after the max number of selected items is reached set the variable "IsToUseFixSelectedText" to True and add here the text to be displayed.
  
  
• AllText: Text to display on the checkbox "All" used to select or deselect all items found.
  Default value: "All"
  
  
• EmptyText: Text to display if the search doesn't return any item.
  Default value: "No item to show"
  
  
• MaxItemsToDisplay: Use this variable to set the number of items to be displayed at once (size of the dropdown).
  Default value: 5
  
  
• MaxItems: Maximum of Items to be listed as selected.
  Example: Selected [Apple, Avocado, Banana, Orange]
  MaxItems = 5 -> "Apple, Avocado, Banana, Orange"
  MaxItems = 3 -> "4 selected"
  Default value: 3
  
  
• MaxTextSize: Maximum of character to show in the selected Items text. If the size is bigger add "..." at the end.
  Example: Selected [Apple, Avocado, Banana, Orange]
  MaxTextSize = 200 -> "Apple, Avocado, Banana, Orange"
  MaxTextSize = 20 -> "Apple, Avocado, Bana..."
  Default value: 100
  
  
• DropDownLimit: To improve performance set a value to limit the maximum of items to be displayed in the dropdown at once.
  By default, the dropdown doesn't have a limit of items to show, so the default value is 0.
  
  
• DropDownLimitPrepositionText: If a limit was set for the max number of items to be displayed in the dropdown when the search returns more items than the limit a text will be displayed informing the number of items displayed and the total number of items found.
  The text has the pattern: (# preposition # description), like "(50 of 267 items)".
  Use this variable to set the preposition of the phrase.
  Default value: "of"
  
  
• DropDownLimitDescriptionText: If a limit was set for the max number of items to be displayed in the dropdown when the search returns more items than the limit a text will be displayed informing the number of items displayed and the total number of items found.
  The text has the pattern: (# preposition # description), like "(50 of 267 items)".
  Use this variable to set the description of the phrase.
  Default value: "items"
  
  
• PromptTextColor: Color of the text shown when no value is selected.
  Default value: "var(--color-neutral-7)"
  
  
• ListTextColor: Color of the text shown when a value is selected.
  Default value: "var(--color-neutral-10)"
  
  
• MenuTextColor: Color of the text on the dropdown items.
  Default value: "#4F575E"
  
  
• DisableColor: Color of the background when disabled.
  Default value: "#FFFFFF"
  
  
• IsMultipleSelection: If you want the block to become a standard dropdown (only one selection) set this variable as False.
  
  
• IsToShowSelectAll: If you want to hide the select all option set this variable as False.
  
  
• IsSearchable: If you want the block to become a standard dropdown (no search field) set this variable as False.
  
  
• IsToShowCounterTag: Set to true if the dropdown should present a counter tag if the number of selected Items is greater than the MaxItems set.
  
  
• IsToUseFixSelectedText: Set this option to true if you need the selected text to be set. Use the variable "FixedSelectedText" to choose the text to display. If nothing were sent the text will be the first option selected in the dropdown.
  This option can be used for example if the counter tag is active and the full list of selected options is irrelevant, being presented only the total number of selections and the first selected item.
  
  
• Enable: Set as False to disable the DropdownSearch.
  
  
• ReturnAll: If the return should be all the Items and not just the selected ones set as True.
  Default value: False

CSS Classes:

/* Main container of the Advanced DropDown Search, includes all elements */

.adds-main {}

/* Edit the tag that appears if elements were selected */

.tag {}

.tag-text {}

/* Main container of the Combobox, use it to set external borders for example */

.adds-combobox {}

.adds-combobox-prompt {}

.adds-combobox-selected {}

/* Internal container of the Combobox */

.adds-combobox-internal {}

/* Style the prompt text */

.adds-prompt {}

/* Style the selected items text */

.adds-selected {}

/* Main container of the Combobox, use it to set external borders for example */

.adds-chevron {}

/* This classe is used to open the dropdown if clicked on the chevron. Add this class to your personalized icon if the icon were changed */

.adds-chevron-down {}

.adds-combobox-selected {}

/* Main container of the list, includes the search box and the list itself */

.adds-main-list {}

/* Wrapper container of the input search */

.adds-search-wrapper {}

/* Input search itself */

.adds-input-search {}

/* External container of the empty search with the class choices__list */

.adds-empty-list {}

/* Internal container of the empty search with the class ItemList choices__item */

.adds-empty-item {}

/* Style the empty search text */

.adds-empty {}

/* External container of the search list with the class choices__list */

.adds-search-list {}

/* Container with the select all item of the list with the classes ItemList and choices__list */

.adds-list-item-all {}

/* Container with the item of the list with the classes ItemList and choices__list */

.adds-list-item {}

/* To change the select all checkbox style with the class checkbox also */

.adds-checkbox-all {}

/* To change the checkbox style with the class checkbox also */

.adds-checkbox {}

/* Style the select all item text */

.adds-item-all {}

/* Style the item text */

.adds-item {}

/* List of searched items with the classes list and list-group */

.adds-item-list {}

OBS: Due to OutSystems limitations it's important to use !important in this CSS classes