@cube-dev/ui-kit 0.0.0-canary-0e9f2c8 → 0.0.0-canary-a07143f

package/es/components/content/Tag/Tag.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/content/Text.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/content/Title.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/Checkbox/Checkbox.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/Checkbox/CheckboxGroup.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/Checkbox/context.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/Checkbox/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/ComboBox/ComboBox.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/ComboBox/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/DatePicker/DateInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/DatePicker/DateInputBase.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/DatePicker/DatePicker.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/DatePicker/DatePickerButton.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/DatePicker/DatePickerElement.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/DatePicker/DatePickerInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/DatePicker/DatePickerSegment.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/DatePicker/DateRangePicker.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/DatePicker/DateRangeSeparatedPicker.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/DatePicker/TimeInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/DatePicker/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/DatePicker/intl.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/DatePicker/parseDate.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/DatePicker/props.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/DatePicker/types.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/DatePicker/utils.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/FileInput/FileInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/FilterListBox/FilterListBox.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 
@@ -538,13 +538,27 @@ export const FilterListBox = forwardRef(function FilterListBox(props, ref) {
             externalOnSelectionChange(selection);
         }
     };
+    // Custom option click handler that ensures search input receives focus
+    const handleOptionClick = (key) => {
+        // Focus the search input to enable keyboard navigation
+        // Use setTimeout to ensure this happens after React state updates
+        setTimeout(() => {
+            if (searchInputRef.current) {
+                searchInputRef.current.focus();
+            }
+        }, 0);
+        // Call the original onOptionClick if provided
+        if (onOptionClick) {
+            onOptionClick(key);
+        }
+    };
     const searchInput = (_jsxs(SearchWrapperElement, { mods: mods, "data-size": "small", children: [_jsx(SearchInputElement, { ref: searchInputRef, "data-is-prefix": true, type: "search", placeholder: searchPlaceholder, value: searchValue, disabled: isDisabled, autoFocus: autoFocus, "data-autofocus": autoFocus ? '' : undefined, styles: searchInputStyles, "data-size": size, role: "combobox", "aria-expanded": "true", "aria-haspopup": "listbox", "aria-activedescendant": listStateRef.current?.selectionManager.focusedKey != null
                     ? `ListBoxItem-${listStateRef.current?.selectionManager.focusedKey}`
                     : undefined, onChange: (e) => {
                     const value = e.target.value;
                     setSearchValue(value);
                 }, ...keyboardProps, ...modAttrs(mods) }), _jsx("div", { "data-element": "Prefix", children: _jsx("div", { "data-element": "InputIcon", children: isLoading ? _jsx(LoadingIcon, {}) : _jsx(SearchIcon, {}) }) })] }));
-    const filterListBoxField = (_jsxs(FilterListBoxWrapperElement, { ref: ref, qa: qa || 'FilterListBox', ...modAttrs(mods), styles: styles, ...focusProps, children: [header ? (_jsx(StyledHeaderWithoutBorder, { "data-size": size, styles: headerStyles, children: header })) : (_jsx("div", { role: "presentation" })), searchInput, showEmptyMessage ? (_jsx("div", { style: { padding: '0.75rem 1rem' }, children: _jsx(Block, { preset: "t4", color: "#dark-03", children: emptyLabel !== undefined ? emptyLabel : 'No results found' }) })) : (_jsx(ListBox, { ref: listBoxRef, "aria-label": innerAriaLabel, selectedKey: selectedKey, defaultSelectedKey: defaultSelectedKey, selectedKeys: selectedKeys, defaultSelectedKeys: defaultSelectedKeys, selectionMode: selectionMode, isDisabled: isDisabled, listRef: listRef, stateRef: listStateRef, listStyles: listStyles, optionStyles: optionStyles, sectionStyles: sectionStyles, headingStyles: headingStyles, validationState: validationState, disallowEmptySelection: props.disallowEmptySelection, disabledKeys: props.disabledKeys, focusOnHover: focusOnHover, shouldUseVirtualFocus: true, footer: footer, footerStyles: footerStyles, mods: mods, size: size, isCheckable: isCheckable, onSelectionChange: handleSelectionChange, onEscape: onEscape, onOptionClick: onOptionClick, children: finalChildren }))] }));
+    const filterListBoxField = (_jsxs(FilterListBoxWrapperElement, { ref: ref, qa: qa || 'FilterListBox', ...modAttrs(mods), styles: styles, ...focusProps, children: [header ? (_jsx(StyledHeaderWithoutBorder, { "data-size": size, styles: headerStyles, children: header })) : (_jsx("div", { role: "presentation" })), searchInput, showEmptyMessage ? (_jsx("div", { style: { padding: '0.75rem 1rem' }, children: _jsx(Block, { preset: "t4", color: "#dark-03", children: emptyLabel !== undefined ? emptyLabel : 'No results found' }) })) : (_jsx(ListBox, { ref: listBoxRef, "aria-label": innerAriaLabel, selectedKey: selectedKey, defaultSelectedKey: defaultSelectedKey, selectedKeys: selectedKeys, defaultSelectedKeys: defaultSelectedKeys, selectionMode: selectionMode, isDisabled: isDisabled, listRef: listRef, stateRef: listStateRef, listStyles: listStyles, optionStyles: optionStyles, sectionStyles: sectionStyles, headingStyles: headingStyles, validationState: validationState, disallowEmptySelection: props.disallowEmptySelection, disabledKeys: props.disabledKeys, focusOnHover: focusOnHover, shouldUseVirtualFocus: true, footer: footer, footerStyles: footerStyles, mods: mods, size: size, isCheckable: isCheckable, onSelectionChange: handleSelectionChange, onEscape: onEscape, onOptionClick: handleOptionClick, children: finalChildren }))] }));
     return wrapWithField(filterListBoxField, ref, mergeProps({ ...props, styles: undefined }, {}));
 });
 FilterListBox.Item = ListBox.Item;

package/es/components/fields/FilterListBox/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/FilterPicker/FilterPicker.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 
@@ -12,7 +12,7 @@ import { useWarn } from '../../../_internal/hooks/use-warn';
 import { DirectionIcon } from '../../../icons';
 import { useProviderProps } from '../../../provider';
 import { BASE_STYLES, COLOR_STYLES, extractStyles, OUTER_STYLES, } from '../../../tasty';
-import { mergeProps, useCombinedRefs } from '../../../utils/react';
+import { mergeProps } from '../../../utils/react';
 import { Button } from '../../actions';
 import { Text } from '../../content/Text';
 import { useFieldProps, useFormProps, wrapWithField } from '../../form';
@@ -43,7 +43,7 @@ export const FilterPicker = forwardRef(function FilterPicker(props, ref) {
             return fieldProps;
         },
     });
-    let { qa, label, extra, icon, labelStyles, isRequired, necessityIndicator, validationState, isDisabled, isLoading, message, mods: externalMods, description, placeholder, size = 'small', styles, listBoxStyles, popoverStyles, type = 'outline', theme = 'default', labelSuffix, children, selectedKey, defaultSelectedKey, selectedKeys, defaultSelectedKeys, onSelectionChange, selectionMode = 'single', listStateRef, focusOnHover, header, footer, headerStyles, footerStyles, allowsCustomValue, renderSummary, isCheckable, ...otherProps } = props;
+    let { qa, label, extra, icon, labelStyles, isRequired, necessityIndicator, validationState, isDisabled, isLoading, message, mods: externalMods, description, placeholder, size = 'small', styles, listBoxStyles, popoverStyles, type = 'outline', theme = 'default', labelSuffix, children, selectedKey, defaultSelectedKey, selectedKeys, defaultSelectedKeys, disabledKeys, onSelectionChange, selectionMode = 'single', listStateRef, focusOnHover, header, footer, headerStyles, footerStyles, allowsCustomValue, renderSummary, isCheckable, ...otherProps } = props;
     styles = extractStyles(otherProps, PROP_STYLES, styles);
     // Warn if isCheckable is false in single selection mode
     useWarn(isCheckable === false && selectionMode === 'single', {
@@ -58,6 +58,7 @@ export const FilterPicker = forwardRef(function FilterPicker(props, ref) {
     // Track popover open/close and capture children order for session
     const [isPopoverOpen, setIsPopoverOpen] = useState(false);
     const cachedChildrenOrder = useRef(null);
+    const triggerRef = useRef(null);
     const isControlledSingle = selectedKey !== undefined;
     const isControlledMultiple = selectedKeys !== undefined;
     const effectiveSelectedKey = isControlledSingle
@@ -291,6 +292,16 @@ export const FilterPicker = forwardRef(function FilterPicker(props, ref) {
     // FilterListBox handles custom values internally when allowsCustomValue={true}
     // We only provide the sorted original children
     const finalChildren = getSortedChildren();
+    // Function to close popover and focus trigger button
+    const closeAndFocus = React.useCallback((close) => {
+        close();
+        // Use setTimeout to ensure the popover closes first, then focus the trigger
+        setTimeout(() => {
+            if (triggerRef.current) {
+                triggerRef.current.focus();
+            }
+        }, 0);
+    }, []);
     const renderTriggerContent = () => {
         // When there is a selection and a custom summary renderer is provided – use it.
         if (hasSelection && typeof renderSummary === 'function') {
@@ -341,7 +352,7 @@ export const FilterPicker = forwardRef(function FilterPicker(props, ref) {
                 }
             }
         }, [state.isOpen, isPopoverOpen]);
-        return (_jsx(Button, { qa: props.qa || 'FilterPicker', type: type, theme: validationState === 'invalid' ? 'danger' : theme, size: size, isDisabled: isDisabled, isLoading: isLoading, mods: {
+        return (_jsx(Button, { ref: triggerRef, qa: props.qa || 'FilterPicker', type: type, theme: validationState === 'invalid' ? 'danger' : theme, size: size, isDisabled: isDisabled, isLoading: isLoading, mods: {
                 placeholder: !hasSelection,
                 selected: hasSelection,
                 ...externalMods,
@@ -349,13 +360,13 @@ export const FilterPicker = forwardRef(function FilterPicker(props, ref) {
     };
     const filterPickerField = (_jsxs(DialogTrigger, { type: "popover", placement: "bottom start", shouldFlip: true, isDismissable: true, children: [renderTrigger, (close) => (_jsx(Dialog, { display: "grid", styles: { gridRows: '1sf', ...popoverStyles }, children: _jsx(FilterListBox, { autoFocus: true, "aria-label": `${props['aria-label'] ?? props.label ?? ''} Picker`, selectedKey: selectionMode === 'single'
                         ? effectiveSelectedKey ?? undefined
-                        : undefined, selectedKeys: selectionMode === 'multiple' ? effectiveSelectedKeys : undefined, focusOnHover: focusOnHover, allowsCustomValue: allowsCustomValue, selectionMode: selectionMode, validationState: validationState, isDisabled: isDisabled, stateRef: listStateRef, isCheckable: isCheckable, mods: {
+                        : undefined, selectedKeys: selectionMode === 'multiple' ? effectiveSelectedKeys : undefined, disabledKeys: disabledKeys, focusOnHover: focusOnHover, allowsCustomValue: allowsCustomValue, selectionMode: selectionMode, validationState: validationState, isDisabled: isDisabled, stateRef: listStateRef, isCheckable: isCheckable, mods: {
                         popover: true,
-                    }, header: header, footer: footer, headerStyles: headerStyles, footerStyles: footerStyles, qa: `${props.qa || 'FilterPicker'}ListBox`, onEscape: close, onOptionClick: (key) => {
+                    }, header: header, footer: footer, headerStyles: headerStyles, footerStyles: footerStyles, qa: `${props.qa || 'FilterPicker'}ListBox`, onEscape: () => closeAndFocus(close), onOptionClick: (key) => {
                         // For FilterPicker, clicking the content area should close the popover
                         // in multiple selection mode (single mode already closes via onSelectionChange)
                         if (selectionMode === 'multiple' && isCheckable) {
-                            close();
+                            closeAndFocus(close);
                         }
                     }, onSelectionChange: (selection) => {
                         // No need to change any flags - children order is cached
@@ -398,10 +409,10 @@ export const FilterPicker = forwardRef(function FilterPicker(props, ref) {
                         }
                         onSelectionChange?.(selection);
                         if (selectionMode === 'single') {
-                            close();
+                            closeAndFocus(close);
                         }
                     }, children: finalChildren }) }))] }));
-    return wrapWithField(filterPickerField, useCombinedRefs(ref), mergeProps({
+    return wrapWithField(filterPickerField, ref, mergeProps({
         ...props,
         styles: undefined,
     }, {}));

package/es/components/fields/FilterPicker/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/Input/Input.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/Input/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/ListBox/ListBox.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 
@@ -109,6 +109,7 @@ const OptionElement = tasty({
             'hovered | focused': '#dark.03',
             selected: '#dark.09',
             'selected & (hovered | focused)': '#dark.12',
+            'selected & hovered & focused': '#dark.15',
             pressed: '#dark.09',
             valid: '#success-bg',
             invalid: '#danger-bg',
@@ -131,7 +132,7 @@ const OptionElement = tasty({
             transition: 'theme',
             opacity: {
                 '': 0,
-                'selected | :hover': 1,
+                'selected | :hover | focused': 1,
             },
             fill: {
                 '': '#white',
@@ -361,7 +362,30 @@ export const ListBox = forwardRef(function ListBox(props, ref) {
         if (focusedKey != null) {
             const idx = itemsArrayRef.current.findIndex((it) => it.key === focusedKey);
             if (idx !== -1) {
-                rowVirtualizer.scrollToIndex(idx, { align: 'auto' });
+                // Check if the focused item is actually visible in the current viewport
+                // (not just rendered due to overscan)
+                const scrollElement = scrollRef.current;
+                if (scrollElement) {
+                    const scrollTop = scrollElement.scrollTop;
+                    const viewportHeight = scrollElement.clientHeight;
+                    const viewportBottom = scrollTop + viewportHeight;
+                    // Find the virtual item for this index
+                    const virtualItems = rowVirtualizer.getVirtualItems();
+                    const virtualItem = virtualItems.find((item) => item.index === idx);
+                    let isAlreadyVisible = false;
+                    if (virtualItem) {
+                        const itemTop = virtualItem.start;
+                        const itemBottom = virtualItem.start + virtualItem.size;
+                        // Check if the item is fully visible in the viewport
+                        // We should scroll if the item is partially hidden
+                        isAlreadyVisible =
+                            itemTop >= scrollTop && itemBottom <= viewportBottom;
+                    }
+                    // Only scroll if the item is not already visible
+                    if (!isAlreadyVisible) {
+                        rowVirtualizer.scrollToIndex(idx, { align: 'auto' });
+                    }
+                }
             }
         }
     }, [shouldVirtualize, listState.selectionManager.focusedKey, itemsArray]);
@@ -386,7 +410,7 @@ export const ListBox = forwardRef(function ListBox(props, ref) {
         footer,
         externalMods,
     ]);
-    const listBoxField = (_jsxs(ListBoxWrapperElement, { ref: ref, qa: qa || 'ListBox', mods: mods, styles: styles, ...focusProps, children: [header ? (_jsx(StyledHeader, { styles: headerStyles, "data-size": size, children: header })) : (_jsx("div", { role: "presentation" })), _jsx(ListBoxScrollElement, { ref: scrollRef, children: _jsx(ListElement, { ...mergedListBoxProps, ref: listRef, styles: listStyles, "aria-disabled": isDisabled || undefined, mods: { sections: hasSections }, style: shouldVirtualize
+    const listBoxField = (_jsxs(ListBoxWrapperElement, { ref: ref, qa: qa || 'ListBox', mods: mods, styles: styles, children: [header ? (_jsx(StyledHeader, { styles: headerStyles, "data-size": size, children: header })) : (_jsx("div", { role: "presentation" })), _jsx(ListBoxScrollElement, { ref: scrollRef, mods: mods, ...focusProps, children: _jsx(ListElement, { ...mergedListBoxProps, ref: listRef, styles: listStyles, "aria-disabled": isDisabled || undefined, mods: { sections: hasSections }, style: shouldVirtualize
                         ? {
                             position: 'relative',
                             height: `${rowVirtualizer.getTotalSize() + 3}px`,
@@ -456,11 +480,15 @@ function Option({ size = 'medium', item, state, styles, isParentDisabled, valida
                 // Checkbox area clicked - only toggle, don't call onOptionClick
                 // Let React Aria handle the selection
                 optionProps.onClick?.(e);
+                // Set focus to the clicked item
+                state.selectionManager.setFocusedKey(item.key);
             }
             else {
                 // Content area clicked - toggle and trigger callback
                 // Let React Aria handle the selection first
                 optionProps.onClick?.(e);
+                // Set focus to the clicked item
+                state.selectionManager.setFocusedKey(item.key);
                 // Then call the callback (which will close the popover in FilterPicker)
                 if (onOptionClick) {
                     onOptionClick(item.key);
@@ -470,6 +498,12 @@ function Option({ size = 'medium', item, state, styles, isParentDisabled, valida
         else {
             // Normal behavior - let React Aria handle it
             optionProps.onClick?.(e);
+            // Set focus to the clicked item
+            state.selectionManager.setFocusedKey(item.key);
+            // Call onOptionClick if provided
+            if (onOptionClick) {
+                onOptionClick(item.key);
+            }
         }
     };
     return (_jsxs(OptionElement, { id: `ListBoxItem-${String(item.key)}`, ...mergeProps(optionProps, hoverProps), ref: combinedRef, style: virtualStyle, "data-size": size, "data-index": virtualIndex, mods: {

package/es/components/fields/ListBox/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/NumberInput/NumberInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/NumberInput/StepButton.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/PasswordInput/PasswordInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/RadioGroup/Radio.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/RadioGroup/RadioGroup.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/RadioGroup/context.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/RadioGroup/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/SearchInput/SearchInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */
 

package/es/components/fields/SearchInput/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0e9f2c8
+ * @cube-dev/ui-kit v0.0.0-canary-a07143f
  * Released under the MIT license.
  */