diff --git a/apps/showcase/doc/autocomplete/MultipleDoc.vue b/apps/showcase/doc/autocomplete/MultipleDoc.vue index f36b9b72e..f870122f2 100644 --- a/apps/showcase/doc/autocomplete/MultipleDoc.vue +++ b/apps/showcase/doc/autocomplete/MultipleDoc.vue @@ -7,7 +7,7 @@ - + @@ -25,7 +25,7 @@ export default { - + `, options: ` @@ -62,7 +62,7 @@ export default { - + diff --git a/packages/primevue/src/autocomplete/style/AutoCompleteStyle.js b/packages/primevue/src/autocomplete/style/AutoCompleteStyle.js index 18165c954..42450110f 100644 --- a/packages/primevue/src/autocomplete/style/AutoCompleteStyle.js +++ b/packages/primevue/src/autocomplete/style/AutoCompleteStyle.js @@ -201,8 +201,8 @@ const theme = ({ dt }) => ` } .p-autocomplete-chip-item.p-focus .p-autocomplete-chip { - background: ${dt('inputchips.chip.focus.background')}; - color: ${dt('inputchips.chip.focus.color')}; + background: ${dt('autocomplete.chip.focus.background')}; + color: ${dt('autocomplete.chip.focus.color')}; } .p-autocomplete-input-chip { diff --git a/packages/themes/src/presets/aura/autocomplete/index.js b/packages/themes/src/presets/aura/autocomplete/index.js index 313742367..b043f13e8 100644 --- a/packages/themes/src/presets/aura/autocomplete/index.js +++ b/packages/themes/src/presets/aura/autocomplete/index.js @@ -75,6 +75,10 @@ export default { }, colorScheme: { light: { + chip: { + focusBackground: '{surface.200}', + color: '{surface.800}' + }, dropdown: { background: '{surface.100}', hoverBackground: '{surface.200}', @@ -85,6 +89,10 @@ export default { } }, dark: { + chip: { + focusBackground: '{surface.700}', + color: '{surface.0}' + }, dropdown: { background: '{surface.800}', hoverBackground: '{surface.700}', diff --git a/packages/themes/src/presets/lara/autocomplete/index.js b/packages/themes/src/presets/lara/autocomplete/index.js index 326b20a1f..ae73de9b2 100644 --- a/packages/themes/src/presets/lara/autocomplete/index.js +++ b/packages/themes/src/presets/lara/autocomplete/index.js @@ -75,6 +75,10 @@ export default { }, colorScheme: { light: { + chip: { + focusBackground: '{surface.200}', + color: '{surface.800}' + }, dropdown: { background: '{surface.50}', hoverBackground: '{surface.100}', @@ -85,6 +89,10 @@ export default { } }, dark: { + chip: { + focusBackground: '{surface.700}', + color: '{surface.0}' + }, dropdown: { background: '{surface.800}', hoverBackground: '{surface.700}', diff --git a/packages/themes/src/presets/material/autocomplete/index.js b/packages/themes/src/presets/material/autocomplete/index.js index 9d8e7f5f4..ec7dd4932 100644 --- a/packages/themes/src/presets/material/autocomplete/index.js +++ b/packages/themes/src/presets/material/autocomplete/index.js @@ -75,6 +75,10 @@ export default { }, colorScheme: { light: { + chip: { + focusBackground: '{surface.300}', + color: '{surface.950}' + }, dropdown: { background: '{surface.100}', hoverBackground: '{surface.200}', @@ -85,6 +89,10 @@ export default { } }, dark: { + chip: { + focusBackground: '{surface.600}', + color: '{surface.0}' + }, dropdown: { background: '{surface.800}', hoverBackground: '{surface.700}', diff --git a/packages/themes/src/presets/nora/autocomplete/index.js b/packages/themes/src/presets/nora/autocomplete/index.js index aed0a5f81..d716741e0 100644 --- a/packages/themes/src/presets/nora/autocomplete/index.js +++ b/packages/themes/src/presets/nora/autocomplete/index.js @@ -79,12 +79,20 @@ export default { }, colorScheme: { light: { + chip: { + focusBackground: '{surface.300}', + color: '{surface.900}' + }, dropdown: { hoverBackground: '{surface.200}', activeBackground: '{surface.300}' } }, dark: { + chip: { + focusBackground: '{surface.600}', + color: '{surface.0}' + }, dropdown: { hoverBackground: '{surface.700}', activeBackground: '{surface.600}'