fix

comps/ui/typeahead-opt.tsx

@@ -18,6 +18,7 @@ export const TypeaheadOptions: FC<{
   }) => boolean;
   onSelect?: (value: string) => void;
   searching?: boolean;
+  searchText?: string;
   width?: number;
 }> = ({
   popup,
@@ -29,6 +30,7 @@ export const TypeaheadOptions: FC<{
   selected,
   onSelect,
   searching,
+  searchText,
   showEmpty,
   width,
 }) => {
@@ -87,7 +89,22 @@ export const TypeaheadOptions: FC<{
         <>
           {options.length === 0 && (
             <div className="c-p-4 c-w-full c-text-center c-text-sm c-text-slate-400">
-              &mdash; Empty &mdash;
+              {!searchText ? (
+                <>&mdash; Empty &mdash;</>
+              ) : (
+                <>
+                  Search
+                  <span
+                    className={css`
+                      font-style: italic;
+                      padding: 0px 5px;
+                    `}
+                  >
+                    "{searchText}"
+                  </span>
+                  not found
+                </>
+              )}
             </div>
           )}
         </>

comps/ui/typeahead.tsx

@@ -213,6 +213,8 @@ export const Typeahead: FC<{
         local.open = true;
         if (e.key === "ArrowDown") {
           e.preventDefault();
+          e.stopPropagation();
+
           const idx = options.findIndex((item) => {
             if (item.value === local.select?.value) return true;
           });
@@ -229,6 +231,7 @@ export const Typeahead: FC<{
         }
         if (e.key === "ArrowUp") {
           e.preventDefault();
+          e.stopPropagation();
 
           const idx = options.findIndex((item) => {
             if (item.value === local.select?.value) return true;
@@ -392,6 +395,7 @@ export const Typeahead: FC<{
         open={local.open}
         options={options}
         searching={local.search.searching}
+        searchText={local.search.input}
         onSelect={(value) => {
           local.open = false;
           resetSearch();