Add search toggles, path filters, and find/replace functionality

This commit is contained in:
2026-05-26 13:35:38 -04:00
parent 6c282ac77f
commit 8fdcdaf412
5 changed files with 361 additions and 16 deletions
+26 -4
View File
@@ -154,16 +154,38 @@
<div class="search-wrapper">
<i data-lucide="search" class="search-icon" style="width:16px;height:16px"></i>
<div class="search-input-wrapper">
<input type="text" id="search-input" placeholder="Recherche..." autocomplete="off">
<input type="text" id="search-input" placeholder="Rechercher dans tous les fichiers..." autocomplete="off">
<div class="search-actions">
<button class="search-btn" id="search-case-btn" type="button" title="Respecter la casse" aria-label="Respecter la casse">
<span>Aa</span>
<button class="search-btn tog" id="search-case-btn" type="button" title="Respecter la casse (Alt-C)">Aa</button>
<button class="search-btn tog" id="search-word-btn" type="button" title="Mot entier (Alt-W)">wd</button>
<button class="search-btn tog" id="search-regex-btn" type="button" title="Expression régulière (Alt-R)">.*</button>
<span class="search-sep"></span>
<button class="search-btn icon-only" id="search-filter-btn" type="button" title="Filtres de chemin (Alt-F)">
<i data-lucide="filter" style="width:14px;height:14px"></i>
</button>
<button class="search-btn" id="search-clear-btn" type="button" title="Effacer la recherche" aria-label="Effacer la recherche">
<button class="search-btn icon-only" id="search-replace-btn" type="button" title="Rechercher et remplacer (Alt-Shift-H)">
<i data-lucide="replace" style="width:14px;height:14px"></i>
</button>
<span class="search-sep"></span>
<span class="search-count" id="search-match-count">0/0</span>
<button class="search-btn icon-only" id="search-prev-btn" type="button" title="Résultat précédent">&#8593;</button>
<button class="search-btn icon-only" id="search-next-btn" type="button" title="Résultat suivant">&#8595;</button>
<button class="search-btn icon-only" id="search-clear-btn" type="button" title="Effacer" aria-label="Effacer la recherche">
<i data-lucide="x" style="width:14px;height:14px"></i>
</button>
</div>
</div>
<!-- Path filter row -->
<div class="search-filter-row" id="search-filter-row" style="display:none">
<input type="text" class="search-filter-input" id="search-include-input" placeholder="Inclure: **/*.md, notes/**">
<input type="text" class="search-filter-input" id="search-exclude-input" placeholder="Exclure: vendor/*, *.lock">
</div>
<!-- Replace row -->
<div class="search-replace-row" id="search-replace-row" style="display:none">
<input type="text" class="search-filter-input" id="search-replace-input" placeholder="Remplacer par...">
<button class="search-replace-btn" id="search-replace-one-btn" type="button" title="Remplacer">Remplacer</button>
<button class="search-replace-btn" id="search-replace-all-btn" type="button" title="Remplacer tout">Tout remplacer</button>
</div>
<!-- Advanced search autocomplete dropdown -->
<div class="search-dropdown" id="search-dropdown" role="listbox" aria-label="Suggestions de recherche" hidden>
<div class="search-dropdown__section search-dropdown__section--history" id="search-dropdown-history">