Skip to content

Commit

Permalink
Handle different menu triggers (DH-18088)
Browse files Browse the repository at this point in the history
  • Loading branch information
bmingles committed Jan 2, 2025
1 parent 5269b19 commit 2b3905b
Show file tree
Hide file tree
Showing 2 changed files with 16 additions and 20 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -4,11 +4,12 @@ import {
findSpectrumPickerScrollArea,
usePopoverOnScrollRef,
} from '@deephaven/react-hooks';
import type { MenuTriggerAction } from '../comboBox';

export interface UsePickerScrollOnOpenOptions {
getInitialScrollPosition?: () => Promise<number | null | undefined>;
onScroll: (event: Event) => void;
onOpenChange?: (isOpen: boolean) => void;
onOpenChange?: (isOpen: boolean, menuTrigger?: MenuTriggerAction) => void;
}

export interface UsePickerScrollOnOpenResult<THtml extends HTMLElement> {
Expand Down Expand Up @@ -37,11 +38,11 @@ export function usePickerScrollOnOpen<THtml extends HTMLElement = HTMLElement>({
);

const onOpenChangeInternal = useCallback(
(isOpen: boolean): void => {
(isOpen: boolean, menuTrigger?: MenuTriggerAction): void => {
// Attach scroll event handling
popoverOnOpenChange(isOpen);

onOpenChange?.(isOpen);
onOpenChange?.(isOpen, menuTrigger);
},
[onOpenChange, popoverOnOpenChange]
);
Expand Down
29 changes: 12 additions & 17 deletions packages/jsapi-components/src/spectrum/ComboBox.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -19,37 +19,32 @@ export function ComboBox(props: ComboBoxProps): JSX.Element {
...pickerProps
} = usePickerProps<ComboBoxProps>(props);

const menuTriggerActionRef = useRef<MenuTriggerAction>();
const isOpenRef = useRef(false);
const inputValueRef = useRef('');

const onInputChange = useCallback(
(value: string) => {
onInputChangeInternal?.(value);

onSearchTextChange(value);
inputValueRef.current = value;

// const searchText = menuTriggerActionRef.current === 'input' ? value : '';

console.log('[TESTING]', menuTriggerActionRef.current, value);
onInputChangeInternal?.(value);

// We want the ComboBox to show all items whenever it is initially opened,
// so keep search text set to empty string while it is closed. This is
// mostly to handle the intial state, since `onInputChange` gets called
// before the user has interacted.
// onSearchTextChange(isOpenRef.current ? value : '');
// Clear search text when ComboBox is closed
onSearchTextChange(isOpenRef.current ? value : '');
},
[onInputChangeInternal, onSearchTextChange]
);

const onOpenChange = useCallback(
(isOpen: boolean, menuTrigger?: MenuTriggerAction) => {
console.log('[TESTING] onOpenChange', isOpen, menuTrigger);
menuTriggerActionRef.current = isOpen ? menuTrigger : undefined;
isOpenRef.current = isOpen;

pickerProps.onOpenChange?.(isOpen);

// Clear filtering on close so that all items show on next open
if (!isOpen) {
onSearchTextChange('');
// Restore search text when ComboBox is being opened if menu trigger was
// from user input. Otherwise we don't want to show all items on initial
// open.
if (isOpen && menuTrigger === 'input') {
onSearchTextChange(inputValueRef.current);
}
},
[onSearchTextChange, pickerProps]
Expand Down

0 comments on commit 2b3905b

Please sign in to comment.