atmosphere explorer pds.ls
tool typescript atproto
Something went wrong. Try again.
1.2 kB · 35 lines
TSX
at main
123456789101112131415161718192021222324252627282930313233343536interface FilterInputProps { value: string; placeholder: string; name?: string; class?: string; inputClass?: string; inputRef?: (input: HTMLInputElement) => void; onInput: (value: string) => void;}
export const FilterInput = (props: FilterInputProps) => ( <div class={`dark:bg-dark-100 flex min-w-0 cursor-text items-center gap-1.5 rounded-md border border-neutral-200 bg-white px-2 text-base dark:border-neutral-600 ${props.class ?? ""}`} onClick={(event) => { const input = event.currentTarget.querySelector("input"); if (event.target !== input) input?.focus(); }} > <span class="iconify lucide--filter shrink-0 text-neutral-500 dark:text-neutral-400" /> <input ref={(input) => props.inputRef?.(input)} type="text" spellcheck={false} autocapitalize="off" autocomplete="off" name={props.name} class={ props.inputClass ?? "min-w-0 grow py-1 select-none placeholder:text-xs focus:outline-none" } placeholder={props.placeholder} value={props.value} onInput={(event) => props.onInput(event.currentTarget.value)} /> </div>);