Fix command palette selection mismatch and card highlight z-index
Sort filtered items by group order so display indices match the array, preventing wrong entity selection. Raise card-highlight z-index above sticky section headers so the outline isn't clipped. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -291,6 +291,8 @@ h2 {
|
||||
padding: 8px 16px;
|
||||
cursor: pointer;
|
||||
transition: background 0.1s;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.cp-result:hover {
|
||||
|
||||
@@ -80,6 +80,8 @@
|
||||
.card-highlight,
|
||||
.template-card.card-highlight {
|
||||
animation: cardHighlight 2s ease-in-out;
|
||||
position: relative;
|
||||
z-index: 11;
|
||||
}
|
||||
|
||||
/* Key Colors target styles */
|
||||
|
||||
@@ -123,18 +123,6 @@ async function _fetchAllEntities() {
|
||||
return _buildItems(results);
|
||||
}
|
||||
|
||||
// ─── Filtering ───
|
||||
|
||||
function _filterItems(query) {
|
||||
if (!query) return _items;
|
||||
const lower = query.toLowerCase();
|
||||
const terms = lower.split(/\s+/).filter(Boolean);
|
||||
return _items.filter(item => {
|
||||
const text = `${item.name} ${item.detail} ${t('search.group.' + item.group)}`.toLowerCase();
|
||||
return terms.every(term => text.includes(term));
|
||||
});
|
||||
}
|
||||
|
||||
// ─── Group ordering ───
|
||||
|
||||
const _groupOrder = [
|
||||
@@ -143,6 +131,25 @@ const _groupOrder = [
|
||||
'audio', 'value',
|
||||
];
|
||||
|
||||
const _groupRank = new Map(_groupOrder.map((g, i) => [g, i]));
|
||||
|
||||
// ─── Filtering ───
|
||||
|
||||
function _filterItems(query) {
|
||||
let result = _items;
|
||||
if (query) {
|
||||
const lower = query.toLowerCase();
|
||||
const terms = lower.split(/\s+/).filter(Boolean);
|
||||
result = _items.filter(item => {
|
||||
const text = `${item.name} ${item.detail} ${t('search.group.' + item.group)}`.toLowerCase();
|
||||
return terms.every(term => text.includes(term));
|
||||
});
|
||||
}
|
||||
// Sort by _groupOrder so indices match the grouped render order
|
||||
result.sort((a, b) => (_groupRank.get(a.group) ?? 99) - (_groupRank.get(b.group) ?? 99));
|
||||
return result;
|
||||
}
|
||||
|
||||
// ─── Rendering ───
|
||||
|
||||
function _render() {
|
||||
|
||||
Reference in New Issue
Block a user