mirror of
https://github.com/primefaces/primevue.git
synced 2025-05-09 00:42:36 +00:00
Refactored AutoComplete CSS
This commit is contained in:
parent
0603df54d9
commit
53779ce3ff
2 changed files with 36 additions and 46 deletions
|
@ -12,48 +12,41 @@ const classes = {
|
|||
'p-disabled': props.disabled,
|
||||
'p-invalid': props.invalid,
|
||||
'p-focus': instance.focused,
|
||||
'p-autocomplete-dd': props.dropdown,
|
||||
'p-autocomplete-multiple': props.multiple,
|
||||
'p-inputwrapper-filled': props.modelValue || ObjectUtils.isNotEmpty(instance.inputValue),
|
||||
'p-inputwrapper-focus': instance.focused,
|
||||
'p-overlay-open': instance.overlayVisible
|
||||
}
|
||||
],
|
||||
input: ({ props }) => [
|
||||
'p-autocomplete-input',
|
||||
{
|
||||
'p-autocomplete-dd-input': props.dropdown
|
||||
'p-autocomplete-open': instance.overlayVisible
|
||||
}
|
||||
],
|
||||
input: 'p-autocomplete-input',
|
||||
container: ({ props, instance }) => [
|
||||
'p-autocomplete-multiple-container',
|
||||
'p-autocomplete-chip-group',
|
||||
{
|
||||
'p-variant-filled': props.variant ? props.variant === 'filled' : instance.$primevue.config.inputStyle === 'filled'
|
||||
}
|
||||
],
|
||||
token: ({ instance, i }) => [
|
||||
'p-autocomplete-token',
|
||||
'p-autocomplete-chip',
|
||||
{
|
||||
'p-focus': instance.focusedMultipleOptionIndex === i
|
||||
}
|
||||
],
|
||||
tokenLabel: 'p-autocomplete-token-label',
|
||||
removeTokenIcon: 'p-autocomplete-token-icon',
|
||||
inputToken: 'p-autocomplete-input-token',
|
||||
tokenLabel: 'p-autocomplete-chip-label',
|
||||
removeTokenIcon: 'p-autocomplete-chip-icon',
|
||||
inputToken: 'p-autocomplete-input-chip',
|
||||
loadingIcon: 'p-autocomplete-loader',
|
||||
dropdownButton: 'p-autocomplete-dropdown',
|
||||
panel: ({ instance }) => [
|
||||
'p-autocomplete-panel p-component',
|
||||
'p-autocomplete-overlay p-component',
|
||||
{
|
||||
'p-ripple-disabled': instance.$primevue.config.ripple === false
|
||||
}
|
||||
],
|
||||
list: 'p-autocomplete-items',
|
||||
list: 'p-autocomplete-list',
|
||||
itemGroup: 'p-autocomplete-item-group',
|
||||
item: ({ instance, option, i, getItemOptions }) => [
|
||||
'p-autocomplete-item',
|
||||
{
|
||||
'p-highlight': instance.isSelected(option),
|
||||
'p-autocomplete-item-selected': instance.isSelected(option),
|
||||
'p-focus': instance.focusedOptionIndex === instance.getOptionIndex(i, getItemOptions),
|
||||
'p-disabled': instance.isOptionDisabled(option)
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue