--- schema_version: "1" id: 70bc6705334782e658bdfb62e0c1ea1a9d59d6166075b3f727bb9ee297db8370 title: Combobox Lightning Web Component ReadMe (Managed Package) collection: admin version: current locale: en-us portal_url: https://docs.salesforce.com/admin/current/en-us/xcloud/264-0-0/os_combobox_lightning_web_component_readme.md canonical_url: https://help.salesforce.com/s/articleView?id=xcloud.os_combobox_lightning_web_component_readme.htm&release=264.0.0&type=5 source_site: help.salesforce.com content_type: documentation content_hash: dc7074bc8a96df80d49c0f9cc84bef04a1800682ffcf3b76bca2cede1af96ca4 description: For the managed package runtime, this page contains a Combobox LWC ReadMe for each Vlocity release. products: - Omnistudio release: "264" --- # Combobox Lightning Web Component ReadMe (Managed Package) For the managed package runtime, this page contains a Combobox LWC ReadMe for each Vlocity release. ![Managed Package app icon](https://sf-zdocs-cdn-prod.zoominsoftware.com/tdta-xcloud-omnistudio_for_managed_packages-264-0-0-production-enus/aa2554ec-624a-4ee6-8da4-6435670e6e62/resources-global/_corporate/images/managedpackageicon.png) This information is for Omnistudio for Managed Packages. For Omnistudio on standard runtime, see [Omnistudio Help](https://help.salesforce.com/s/articleView?id=xcloud.os_omnistudio_standard.htm&language=en_US). ## Vlocity Health and Insurance Spring '21 The Combobox Lightning Web Component is an input element in which the user can select an option from a list of options. ## Available c-combobox Attributes

Attribute

Value

Type

Required

Description

label

  

string

  

Adds a title for the combobox component.

name

  

string

  

Adds a name to the combobox component.

placeholder

  

string

  

Adds text to the input element to prompt user to select from the dropdown (list of options to render labels). For example, "Select an option".

variant

standard, label-hidden (Default: standard)

string

  

Changes the appearance of the input element.

value

  

string

  

Adds a pre-populatd value to the combobox input.

options

  

array

yes

Sets the list of options available for selection. Each option has "label" and "value" attributes, such as {"label":"Apple","value":"apple"}. It also supports grouping if option is set as {"label":"Apple","value":"apple", "group":"group1"}

required

true, false (Default: false)

boolean

  

If the user must enter a value before submitting the form, set to true.

multiple

true, false (Default: false)

boolean

  

To enable the ability to select multiple options, set to true.

searchable

true, false (Default: false)

boolean

  

To enable user search, set to true.

read-only

true, false (Default: false)

boolean

  

To prevent the user from editing the field, set to true.

theme

slds, nds (Default: slds)

string

  

Sets the theme for the combobox component.

errormessage

warning, success, error, info

string

  

Sets the style of the error message.

disabled

true, false (Default: false)

boolean

  

To disable the combobox, set to true.

max-count

  

number

  

Sets the number of options to display before user must scroll.

sorted

true, false (Default: false)

boolean

  

If set to true the options are sorted in alphabetic order of value or the sortField.

sortField

string

number

  

To set the sortField used to sort the options. Works only if sorted is true

deleteMultiple

true, false (Default: false)

boolean

  

To have delete on multiple select pill

isDisplayFlex

true, false (Default: false)

boolean

  

To set display:flex style for pill wrapper div and it also set overflow:hidden and text-overflow:ellipsis style to each pill. Selected values will be displayed as pills only if the multiple attribute is true.

data-show-lookup

true, false (Default: false)

string

  

Applicable only when read-only is set to true. Set to true to display the lookup fields.
## Example c-combobox Component ```
Footer
``` ## Example Label Slot Usage A named slot (name = label) is available in the event a user would like to dynamically insert markup next to the input's label. ``` Additional markup is inserted here ``` ## Vlocity Insurance and Health Summer '20 The _Combobox Lightning Web Component_ is an input element in which the user can select an option from a list of options. ## Available c-combobox Attributes

Attribute

Value

Type

Required

Description

deleteMultiple

true, false (Default: false)

boolean

  

Enables deleting multiple pills.

disabled

true, false (Default: false)

    

To disable the combobox, set to true.

errormessage

warning, success, error, info

string

  

Sets the style of the error message.

isDisplayFlex

true, false (Default: false)

boolean

  

Makes the wrapper 'div' of the pill flexible by setting the CSS 'display' property to 'flex'. Also sets 'overflow' property to 'hidden', and 'text-overflow' to 'ellipsis'. Selected values display as pills only if the multiple attribute is set to true.

label

  

string

  

Adds a title for the combobox component.

max-count

  

number

  

Sets the number of options to display before the user must scroll.

multiple

true, false (Default: false)

    

To enable the ability to select multiple options, set to true.

name

  

string

  

Adds a name to the combobox component.

options

  

array

yes

Sets the list of options available for selection. Each option has "label" and "value" attributes, such as {"label":"Apple","value":"apple"}. It also supports grouping if option is set as {"label":"Apple","value":"apple", "group":"group1"}

placeholder

  

string

  

Adds text to the input element to prompt user to select from the dropdown (list of options to render labels). For example, "Select an option".

read-only

true, false (Default: false)

    

To prevent the user from editing the field, set to true.

required

true, false (Default: false)

    

If the user must enter a value before submitting the form, set to true.

searchable

true, false (Default: false)

    

To enable user search, set to true.

sortField

string

number

  

Sets the field used to sort the options. Works only if sorted is set o true.

sorted

true, false (Default: false)

boolean

  

If set to true the options are sorted in alphabetic order of value or the sortField.

theme

slds, nds (Default: slds)

string

  

Sets the theme for the combobox component.

value

  

string

  

Adds a pre-populatd value to the combobox input.

variant

standard, label-hidden (Default: standard)

string

  

Changes the appearance of the input element.
## Example c-combobox Component ```
Footer
``` ## Label Slot Usage A named slot (name = label) is available in the event a user would like to dynamically insert markup next to the input's label. ``` Additional markup is inserted here ``` ## Vlocity Insurance and Health Winter '20 and Vlocity CME Spring '20 The _Combobox Lightning Web Component_ is an input element in which the user can select an option from a list of options. ## Available c-combobox Attributes

Attribute

Value

Type

Required

Description

disabled

true, false (Default: false)

    

To disable the combobox, set to true.

errormessage

warning, success, error, info

string

  

Sets the style of the error message.

label

  

string

  

Adds a title for the combobox component.

max-count

  

number

  

Sets the number of options to display before user must scroll.

multiple

true, false (Default: false)

    

To enable the ability to select multiple options, set to true.

name

  

string

  

Adds a name to the combobox component.

options

  

array

yes

Sets the list of options available for selection. Each option has "label" and "value" attributes, such as {"label":"Apple","value":"apple"}.

placeholder

  

string

  

Adds text to the input element to prompt user to select from the dropdown (list of options to render labels). For example, "Select an option".

read-only

true, false (Default: false)

    

To prevent the user from editing the field, set to true.

required

true, false (Default: false)

    

If the user must enter a value before submitting the form, set to true.

searchable

true, false (Default: false)

    

To enable user search, set to true.

theme

slds, nds (Default: slds)

string

  

Sets the theme for the combobox component.

value

  

string

  

Adds a pre-populatd value to the combobox input.

variant

standard, label-hidden (Default: standard)

string

  

Changes the appearance of the input element.
## Example c-combobox Component ```
Footer
``` ## Vlocity Insurance and Health Summer '19 and Vlocity CME Fall '19 The _Combobox Lightning Web Component_ is an input element in which the user can select an option from a list of options. ## Available c-combobox Attributes

Attribute

Value

Type

Required

Description

disabled

true, false (Default: false)

    

To disable the combobox, set to true.

errormessage

warning, success, error, info

string

  

Sets the style of the error message.

label

  

string

  

Adds a title for the combobox component.

max-count

  

number

  

Sets the number of options to display before user must scroll.

multiple

true, false (Default: false)

    

To enable the ability to select multiple options, set to true.

name

  

string

  

Adds a name to the combobox component.

options

  

array

yes

Sets the list of options available for selection. Each option has label'' and `value'' attributes, such as{"label":"Apple","value":"apple"}`.

placeholder

  

string

  

Adds text to the input element to prompt user to select from the dropdown (list of options to render labels). For example, ``Select an option''.

read-only

true, false (Default: false)

    

To prevent the user from editing the field, set to true.

required

true, false (Default: false)

    

If the user must enter a value before submitting the form, set to true.

searchable

true, false (Default: false)

    

To enable user search, set to true.

theme

slds, nds (Default: slds)

string

  

Sets the theme for the combobox component.

value

  

string

  

Adds a pre-populatd value to the combobox input.

variant

standard, label-hidden (Default: standard)

string

  

Changes the appearance of the input element.
## Example c-combobox Component ```
Footer
```