@noya-app/noya-designsystem 0.1.74 → 0.1.75

package/dist/index.mjs

@@ -10961,9 +10961,28 @@ var ComboboxState = class {
     this.filter = this.lastSubmittedValue.itemName;
     this.notifyChange();
   }
-  reset(newFilter = "") {
+  reset(newFilter = "", options) {
     this.filter = newFilter;
-    this.selectedIndex = 0;
+    const filteredItems = this.getFilteredItems();
+    const normalizedTitle = options?.selectedItemTitle ? options.selectedItemTitle.toString().toLowerCase() : void 0;
+    const normalizedValue = options?.selectedItemValue ? options.selectedItemValue.toString().toLowerCase() : void 0;
+    const matchedIndex = normalizedTitle || normalizedValue ? filteredItems.findIndex((item) => {
+      if (!isSelectableMenuItem(item)) return false;
+      const title = item.title?.toString().toLowerCase();
+      const value = item.value?.toString().toLowerCase();
+      if (normalizedValue && value === normalizedValue) return true;
+      if (normalizedTitle && title === normalizedTitle) return true;
+      return false;
+    }) : -1;
+    if (matchedIndex !== -1) {
+      this.selectedIndex = matchedIndex;
+      this.notifyChange();
+      return;
+    }
+    const firstSelectableIndex = filteredItems.findIndex(
+      (item) => isSelectableMenuItem(item)
+    );
+    this.selectedIndex = firstSelectableIndex === -1 ? 0 : firstSelectableIndex;
     this.notifyChange();
   }
   getSelectedItem() {
@@ -11247,6 +11266,13 @@ var Combobox = memoGeneric(
       }
     }
     const initialValueString = getInitialValueString();
+    const resetSelectionOptions = useMemo28(
+      () => props.mode === "string" ? { selectedItemTitle: initialValueString } : {
+        selectedItemTitle: initialValueString,
+        selectedItemValue: props.value?.value?.toString()
+      },
+      [initialValueString, props.mode, props.value]
+    );
     const [comboboxState] = useState27(
       () => new ComboboxState(
         items,
@@ -11257,6 +11283,7 @@ var Combobox = memoGeneric(
     const state = useComboboxState(comboboxState);
     const [isFocused, setIsFocused] = useState27(false);
     const listRef = useRef21(null);
+    const menuOpenedRef = useRef21(false);
     const [shouldBlur, setShouldBlur] = useState27(false);
     const { fieldId: id } = useLabel({
       fieldId: rest.id
@@ -11274,9 +11301,20 @@ var Combobox = memoGeneric(
         listRef.current.scrollToIndex(selectedIndex);
       }
     }, [selectedIndex]);
+    useEffect20(() => {
+      if (!shouldShowMenu) {
+        menuOpenedRef.current = false;
+        return;
+      }
+      if (menuOpenedRef.current) return;
+      menuOpenedRef.current = true;
+      if (listRef.current) {
+        listRef.current.scrollToIndex(selectedIndex);
+      }
+    }, [shouldShowMenu, selectedIndex]);
     const handleBlur = useCallback28(() => {
       ref.current?.blur();
-      comboboxState.reset(initialValueString);
+      comboboxState.reset(initialValueString, resetSelectionOptions);
       if (props.mode === "string") {
         props.onBlur?.(
           state.filter === state.lastSubmittedValue.filter,
@@ -11292,12 +11330,20 @@ var Combobox = memoGeneric(
         }
       }
       setIsFocused(false);
-    }, [filter, initialValueString, props, state, comboboxState]);
+    }, [
+      filter,
+      initialValueString,
+      props,
+      resetSelectionOptions,
+      state,
+      comboboxState
+    ]);
     const handleFocus = useCallback28(
       (event) => {
         setIsFocused(true);
         comboboxState.reset(
-          openMenuBehavior === "showAllItems" ? "" : initialValueString
+          openMenuBehavior === "showAllItems" ? "" : initialValueString,
+          resetSelectionOptions
         );
         if (ref.current) {
           const length = ref.current.value.length;
@@ -11305,7 +11351,13 @@ var Combobox = memoGeneric(
         }
         onFocus?.(event);
       },
-      [initialValueString, onFocus, openMenuBehavior, comboboxState]
+      [
+        initialValueString,
+        onFocus,
+        openMenuBehavior,
+        resetSelectionOptions,
+        comboboxState
+      ]
     );
     const handleUpdateSelection = useCallback28(
       (item) => {
@@ -11470,7 +11522,8 @@ var Combobox = memoGeneric(
           return;
         }
         comboboxState.reset(
-          openMenuBehavior === "showAllItems" ? "" : initialValueString
+          openMenuBehavior === "showAllItems" ? "" : initialValueString,
+          resetSelectionOptions
         );
         ref.current?.focus();
       },
@@ -11479,6 +11532,7 @@ var Combobox = memoGeneric(
         openMenuBehavior,
         initialValueString,
         handleBlur,
+        resetSelectionOptions,
         comboboxState
       ]
     );