--- parts: - API Table - Combobox title: 'Combobox: API Table' eleventyNavigation: key: API Table >> Combobox title: API Table order: 90 parent: Combobox --- # Combobox: API Table ## class: `LionCombobox`, `lion-combobox` ### Fields | Name | Privacy | Type | Default | Description | Inherited From | | ------------------------------ | --------- | ------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------- | | `activeIndex` | public | | | | ListboxMixin | | `allowCustomChoice` | public | `boolean` | `false` | | CustomChoiceGroupMixin | | `autocomplete` | public | `'none'\|'list'\|'inline'\|'both'` | `'both'` | When "list", will filter listbox suggestions based on textbox value. When "both", an inline completion string will be added to the textbox as well. | | | `autofocus` | public | `boolean` | `false` | | FocusMixin | | `checkedIndex` | public | `number \| number[]` | | | ListboxMixin | | `config` | public | `Partial` | `{}` | Configure the many options of the \`OverlayController\` | OverlayMixin | | `customChoices` | public | | | Custom elements are all missing elements that have no corresponding element, independent if enabled or not. | CustomChoiceGroupMixin | | `defaultValidators` | public | `Validator[]` | `[]` | Used by Subclassers to add default Validators to a particular FormControl. A date input for instance, always needs the isDate validator. | ValidateMixin | | `dirty` | public | `boolean` | `false` | True when user has changed the value of the field. | InteractionStateMixin | | `disabled` | public | `boolean` | `false` | | DisabledMixin | | `done` | public | `boolean` | `false` | | FormRegistrarMixin | | `fieldName` | public | `string` | | Will be used in validation messages to refer to the current field | FormControlMixin | | `filled` | public | `boolean` | `false` | True when the modelValue is non-empty (see \_isEmpty in FormControlMixin) | InteractionStateMixin | | `focused` | public | `boolean` | `false` | Whether the focusable element within (\`.\_focusableNode\`) is focused. Reflects to attribute '\[focused]' as a styling hook | FocusMixin | | `focusedVisible` | public | `boolean` | `false` | Whether the focusable element within (\`.\_focusableNode\`) matches ':focus-visible' Reflects to attribute '\[focused-visible]' as a styling hook See: https\://developer.mozilla.org/en-US/docs/Web/CSS/:focus-visible | FocusMixin | | `formattedValue` | public | | | | ChoiceGroupMixin | | `formElements` | public | `FormControlsCollection` | `new FormControlsCollection()` | Closely mimics the natively supported HTMLFormControlsCollection. It can be accessed both like an array and an object (based on control/element names). | FormRegistrarMixin | | `hasFeedbackFor` | public | `ValidationType[]` | `[]` | As soon as validation happens (after modelValue/validators/validator param change), this array is updated with the active ValidationTypes ('error'\|'warning'\|'success'\|'info' etc.). Notice the difference with \`.showsFeedbackFor\`, which filters \`.hasFeedbackFor\` based on \`.feedbackCondition()\`. For styling purposes, will be reflected to \[has-feedback-for="error warning"]. This can be useful for subtle visual feedback on keyup, like a red/green border around an input. | ValidateMixin | | `hasNoDefaultSelected` | public | `boolean` | `false` | When setting this to true, on initial render, no option will be selected. It is advisable to override \`\_noSelectionTemplate\` method in the select-invoker to render some kind of placeholder initially | ListboxMixin | | `helpText` | public | `string` | | The helpt text for the input node. When no light dom defined via \[slot=help-text], this value will be used | FormControlMixin | | `initComplete` | public | `Promise` | `new Promise((resolve, reject) => { this.__resolveInitComplete = resolve; this.__rejectInitComplete = reject; })` | initComplete resolves after all pending initialization logic (for instance \`\\`) is executed | FormRegistrarMixin | | `isPending` | public | `boolean` | `false` | Flag indicating whether async validation is pending. Creates attribute \[is-pending] as a styling hook | ValidateMixin | | `label` | public | `string` | | The label text for the input node. When no light dom defined via \[slot=label], this value will be used. | FormControlMixin | | `labelSrOnly` | public | `boolean` | `false` | The label will only be visible for srceen readers when true | FormControlMixin | | `matchMode` | public | `'begin'\|'all'` | `'all'` | When typing in the textbox, will by default be set on 'begin', only matching the beginning part in suggestion list. => 'a' will match 'apple' from \['apple', 'pear', 'citrus']. When set to 'all', will match middle of the word as well => 'a' will match 'apple' and 'pear' | | | `modelValue` | public | `object` | | | FormControlMixin | | `multipleChoice` | public | `boolean` | `false` | When false (default), modelValue and serializedValue will reflect the currently selected choice (usually a string). When true, modelValue will and serializedValue will be an array of strings. | ChoiceGroupMixin | | `opened` | public | `boolean` | `false` | If you add the opened attribute a dialog will be opened on page load. The invoker can be left out in case the user does not need to be able to reopen the dialog. | OverlayMixin | | `operationMode` | public | `OperationMode` | | Types of input interaction of the FormControl (for instance 'enter'\|'select'\|'upload') | ValidateMixin | | `orientation` | public | `string` | `'vertical'` | Informs screen reader and affects keyboard navigation. By default 'vertical' | ListboxMixin | | `prefilled` | public | `boolean` | `false` | True when user has left non-empty field or input is prefilled. The name must be seen from the point of view of the input field: once the user enters the input field, the value is non-empty. | InteractionStateMixin | | `readOnly` | public | `boolean` | `false` | A Boolean attribute which, if present, indicates that the user should not be able to edit the value of the input. The difference between disabled and readonly is that read-only controls can still function, whereas disabled controls generally do not function as controls until they are enabled. (From: https\://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#attr-readonly) | FormControlMixin | | `registrationComplete` | public | `Promise & {done?:boolean}` | `new Promise((resolve, reject) => { this.__resolveRegistrationComplete = resolve; this.__rejectRegistrationComplete = reject; })` | registrationComplete waits for all children formElements to have registered | FormRegistrarMixin | | `requireOptionMatch` | public | `boolean` | `true` | If set to false, the value is allowed to not match any of the options. We set the default to true for backwards compatibility | | | `rotateKeyboardNavigation` | public | `boolean` | `true` | Will give first option active state when navigated to the next option from last option. | ListboxMixin | | `selectionFollowsFocus` | public | `boolean` | `true` | When true, will synchronize activedescendant and selected element on arrow key navigation. This behavior can usually be seen on \