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: `
@@ -34,7 +34,7 @@ export default {
-
+
@@ -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}'