|
624 | 624 | </div> |
625 | 625 | </div> |
626 | 626 |
|
| 627 | + <div class="packages-search"> |
| 628 | + <input |
| 629 | + type="text" |
| 630 | + class="search-input" |
| 631 | + value={packageSearch} |
| 632 | + oninput={(e) => handleSearchInput(e.currentTarget.value)} |
| 633 | + placeholder="Search Homebrew packages or enter tap (e.g. steipete/tap/codexbar)" |
| 634 | + /> |
| 635 | + </div> |
| 636 | + {#if searchLoading} |
| 637 | + <div class="search-status">Searching Homebrew...</div> |
| 638 | + {:else if packageSearch.length >= 2 && searchResults.length === 0} |
| 639 | + <div class="search-status">No Homebrew packages found for "{packageSearch}"</div> |
| 640 | + {:else if packageSearch.length >= 2} |
| 641 | + <div class="packages-grid"> |
| 642 | + {#each searchResults as result} |
| 643 | + <button type="button" class="package-item" class:selected={selectedPackages.has(result.name)} onclick={() => togglePackage(result.name, result.type)}> |
| 644 | + <span class="check-indicator">{selectedPackages.has(result.name) ? '✓' : ''}</span> |
| 645 | + <div class="package-content"> |
| 646 | + <div class="package-info"> |
| 647 | + <span class="package-name">{result.name}</span> |
| 648 | + <span class="package-type">{result.type}</span> |
| 649 | + </div> |
| 650 | + {#if result.desc} |
| 651 | + <span class="package-desc">{result.desc.slice(0, 60)}{result.desc.length > 60 ? '...' : ''}</span> |
| 652 | + {/if} |
| 653 | + </div> |
| 654 | + </button> |
| 655 | + {/each} |
| 656 | + </div> |
| 657 | + {:else} |
| 658 | + <div class="search-hint">Type at least 2 characters to search Homebrew packages</div> |
| 659 | + {/if} |
| 660 | + |
627 | 661 | <div class="packages-group"> |
628 | 662 | <div class="group-header"> |
629 | 663 | <span class="group-label">NPM</span> |
|
673 | 707 | <div class="search-hint">Type at least 2 characters to search npm packages</div> |
674 | 708 | {/if} |
675 | 709 | </div> |
676 | | - <div class="packages-search"> |
677 | | - <input |
678 | | - type="text" |
679 | | - class="search-input" |
680 | | - value={packageSearch} |
681 | | - oninput={(e) => handleSearchInput(e.currentTarget.value)} |
682 | | - placeholder="Search Homebrew packages or enter tap (e.g. steipete/tap/codexbar)" |
683 | | - /> |
684 | | - </div> |
685 | | - {#if searchLoading} |
686 | | - <div class="search-status">Searching Homebrew...</div> |
687 | | - {:else if packageSearch.length >= 2 && searchResults.length === 0} |
688 | | - <div class="search-status">No Homebrew packages found for "{packageSearch}"</div> |
689 | | - {:else if packageSearch.length >= 2} |
690 | | - <div class="packages-grid"> |
691 | | - {#each searchResults as result} |
692 | | - <button type="button" class="package-item" class:selected={selectedPackages.has(result.name)} onclick={() => togglePackage(result.name, result.type)}> |
693 | | - <span class="check-indicator">{selectedPackages.has(result.name) ? '✓' : ''}</span> |
694 | | - <div class="package-content"> |
695 | | - <div class="package-info"> |
696 | | - <span class="package-name">{result.name}</span> |
697 | | - <span class="package-type">{result.type}</span> |
698 | | - </div> |
699 | | - {#if result.desc} |
700 | | - <span class="package-desc">{result.desc.slice(0, 60)}{result.desc.length > 60 ? '...' : ''}</span> |
701 | | - {/if} |
702 | | - </div> |
703 | | - </button> |
704 | | - {/each} |
705 | | - </div> |
706 | | - {:else} |
707 | | - <div class="search-hint">Type at least 2 characters to search Homebrew packages</div> |
708 | | - {/if} |
709 | 710 | </div> |
710 | 711 | {/if} |
711 | 712 |
|
|
0 commit comments