@homecode/ui 4.30.14 → 4.30.16

package/dist/esm/src/components/Autocomplete/Autocomplete.js

@@ -109,6 +109,7 @@ function Autocomplete(props) {
     const displayCount = displayItems.length;
     const hasMore = totalCount > 0 && displayCount < totalCount;
     const classes = cn(S.root, className, popupProps.className);
+    const mergedPopupIsOpen = isOpen !== undefined ? isOpen : popupProps?.isOpen;
     const handleFocus = (e) => {
         isFocusedRef.current = true;
         setIsFocused(true);
@@ -162,17 +163,21 @@ function Autocomplete(props) {
         setTotalCount(0);
         fetchOptionsCore(option.label, 0);
         onSelect?.(option);
-        // set input caret to the end
-        requestAnimationFrame(() => {
-            const input = inputRef.current;
-            if (!input)
-                return;
-            input.focus();
-            input.setSelectionRange(option.label.length, option.label.length);
-        });
+        // Uncontrolled only: refocusing fires input onFocus; with controlled isOpen that often reopens
+        // the popup right after onSelect closed it (see ControllablePopup pattern).
+        if (isOpen === undefined) {
+            requestAnimationFrame(() => {
+                const input = inputRef.current;
+                if (!input)
+                    return;
+                input.focus();
+                input.setSelectionRange(option.label.length, option.label.length);
+            });
+        }
     };
+    const isPopupOpenForInput = isOpen !== undefined ? isOpen : isFocused;
     const { focusedIndex, setFocusedIndex } = useListKeyboardControl({
-        isActive: isOpen,
+        isActive: isPopupOpenForInput,
         itemsCount: displayItems.length,
         onSelect: index => handleSelect(displayItems[index]),
     });
@@ -347,7 +352,7 @@ function Autocomplete(props) {
         if (props.renderItem) {
             return props.renderItem(itemPropsForRender);
         }
-        return (jsx(Menu.Item, { ...itemProps, focused: itemPropsForRender.focused, selected: itemPropsForRender.isSelected, className: itemPropsForRender.className, onClick: itemPropsForRender.onClick, onMouseEnter: itemPropsForRender.onMouseEnter, style: itemPropsForRender.style, children: option.render ? option.render(option) : option.label }));
+        return (jsx(Menu.Item, { ...itemProps, focused: itemPropsForRender.focused, selected: itemPropsForRender.isSelected, className: itemPropsForRender.className, onClick: itemPropsForRender.onClick, onMouseEnter: itemPropsForRender.onMouseEnter, style: { ...itemProps.style, height: itemHeight }, children: option.render ? option.render(option) : option.label }));
     }, [
         displayItems,
         focusedIndex,
@@ -356,6 +361,7 @@ function Autocomplete(props) {
         handleSelect,
         setFocusedIndex,
         props.renderItem,
+        itemHeight,
     ]);
     const LoadingPlaceholder = loadingPlaceholder ?? (jsxs("div", { className: S.loadingPlaceholder, children: [isLoadingMore && jsx(Shimmer, { size: size, round: round }), "Loading..."] }));
     const optionsList = useMemo(() => {
@@ -401,7 +407,7 @@ function Autocomplete(props) {
         scrollToSelected,
         LoadingPlaceholder,
     ]);
-    return (jsx(Popup, { className: classes, isOpen: isOpen, focusControl: true, round: round, size: size, blur: blur, direction: "bottom", ...popupProps, trigger: jsx(Input, { ref: inputRef, 
+    return (jsx(Popup, { className: classes, focusControl: true, round: round, size: size, blur: blur, direction: "bottom", ...popupProps, isOpen: mergedPopupIsOpen, trigger: jsx(Input, { ref: inputRef, 
             // @ts-ignore
             size: size, round: round, ...inputProps, value: inputDisplayValue, onChange: handleInputChange, onFocus: handleFocus, onBlur: handleBlur, className: cn(inputProps.className, selectable && !isFocused && S.inputSelectableDisplay) }), content: optionsList, contentProps: {
             ...popupProps?.contentProps,

package/dist/esm/src/components/Select/Select2.js

@@ -208,9 +208,7 @@ function Select2(props) {
         const { label, className, ...rest } = triggerProps;
         const props = omit(rest, ['name', 'inputProps']);
         isMultiple$1 && value && value.length > 0;
-        const fullSelectedLabel = [label, additionalLabel].filter(Boolean);
-        // ?
-        // : [selectedLabel, label, additionalLabel].filter(Boolean);
+        const fullSelectedLabel = [selectedLabel, additionalLabel].filter(Boolean);
         const hasSelected = fullSelectedLabel.length > 0;
         const displayLabel = hasSelected ? fullSelectedLabel : label;
         const title = hasSelected && !isMultiple$1 ? fullSelectedLabel : null;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@homecode/ui",
-  "version": "4.30.14",
+  "version": "4.30.16",
   "description": "React UI components library",
   "scripts": {
     "tests": "jest",