flo-bit.dev / ui-kit
[READ-ONLY] Mirror of https://github.com/flo-bit/ui-kit. 🦊 fox ui, svelte 5 and tailwind 4 flo-bit.dev/ui-kit/
svelte tailwindcss ui-components
0
Fork 0

Configure Feed

Select the types of activity you want to include in your feed.

Merge pull request #90 from flo-bit/fix/atprotologin

fix atproto login

authored by

Florian and committed by
GitHub (Apr 19, 2026, 5:32 PM +0200) 890b1cc9 6cfd810f

+14 -7
+5
.changeset/small-meals-teach.md
··· 1 + --- 2 + '@foxui/social': patch 3 + --- 4 + 5 + fix atproto login for handles that don't appear in typeahead, and close the typeahead popup when the input loses focus
+9 -7
packages/social/src/lib/components/atproto-handle-popup/AtprotoHandlePopup.svelte
··· 4 4 import { Avatar, cn, inputVariants } from '@foxui/core'; 5 5 6 6 let results: Profile[] = $state([]); 7 - let inputValue = $state(''); 8 7 9 8 let { 10 - value = $bindable(), 9 + value = $bindable(''), 11 10 onselected, 12 11 ref = $bindable(null), 13 12 host = 'https://public.api.bsky.app', ··· 38 37 39 38 function select(actor: Profile) { 40 39 results = []; 41 - inputValue = ''; 42 40 value = actor.handle; 43 41 onselected?.(actor); 44 42 } ··· 48 46 <Command.Root shouldFilter={false} class="w-full"> 49 47 <Command.Input 50 48 bind:ref 51 - bind:value={inputValue} 52 - oninput={() => search(inputValue)} 49 + bind:value 50 + oninput={() => search(value)} 51 + onblur={() => { 52 + results = []; 53 + }} 53 54 onkeydown={(e) => { 54 - if (e.key === 'Enter' && results.length === 0 && inputValue) { 55 + if (e.key === 'Enter' && results.length === 0 && value) { 55 56 e.preventDefault(); 56 - select({ handle: inputValue, displayName: '', avatar: '', did: '' }); 57 + select({ handle: value, displayName: '', avatar: '', did: '' }); 57 58 } 58 59 }} 59 60 class={cn(inputVariants(), 'w-full')} ··· 72 73 /> 73 74 {#if results.length > 0} 74 75 <Command.List 76 + onpointerdown={(e) => e.preventDefault()} 75 77 class="border-base-300 bg-base-50 dark:bg-base-800 dark:border-base-700 absolute z-100 mt-2.5 max-h-[30dvh] w-full overflow-y-auto rounded-ui border p-1 shadow-lg" 76 78 > 77 79 {#each results as actor (actor.did)}