Pass unstable_disclosureRef to Reakit's Menu

jxom · Aug 13, 2020 · 9991398 · 9991398
1 parent 8b9e0e0
commit 9991398
Show file tree

Hide file tree

Showing 4 changed files with 6 additions and 98 deletions.
diff --git a/packages/bumbag/src/Autosuggest/Autosuggest.tsx b/packages/bumbag/src/Autosuggest/Autosuggest.tsx
@@ -10,7 +10,7 @@ import { Input, InputProps } from '../Input';
 import {
   DropdownMenu,
   DropdownMenuPopover,
-  DropdownMenuDisclosure,
+  DropdownMenuButton,
   DropdownMenuPopoverProps,
   DropdownMenuItemProps,
   DropdownMenuInitialState,
@@ -252,7 +252,7 @@ const useProps = createHook<AutosuggestProps>(
       gutter: 4,
       ...dropdownMenuInitialState,
     });
-    const dropdownMenuDisclosureProps = DropdownMenuDisclosure.useProps(dropdownMenu);
+    const dropdownMenuButtonProps = DropdownMenuButton.useProps(dropdownMenu);
 
     //////////////////////////////////////////////////
 
@@ -584,21 +584,20 @@ const useProps = createHook<AutosuggestProps>(
 
     return {
       ...boxProps,
-      'aria-expanded': dropdownMenuDisclosureProps['aria-expanded'],
+      'aria-expanded': dropdownMenuButtonProps['aria-expanded'],
       'aria-haspopup': 'listbox',
       'aria-owns': dropdownMenu.baseId,
       role: 'combobox',
       className,
       children: (
         <AutosuggestContext.Provider value={context}>
           <Input
-            {...omit(dropdownMenuDisclosureProps, 'type', 'className', 'role')}
+            {...omit(dropdownMenuButtonProps, 'type', 'className', 'role')}
             after={inputValue && <ClearButton onClick={handleClear} buttonProps={clearButtonProps} />}
             aria-autocomplete="list"
             aria-activedescendant={dropdownMenu?.items?.[highlightedIndex]?.id}
             className={inputClassName}
             disabled={disabled}
-            elementRef={dropdownMenuDisclosureProps.ref}
             isLoading={isInputLoading}
             onBlur={handleBlurInput}
             onClick={handleClickInput}

diff --git a/packages/bumbag/src/DropdownMenu/DropdownMenuDisclosure.tsx b/packages/bumbag/src/DropdownMenu/DropdownMenuDisclosure.tsx
diff --git a/packages/bumbag/src/DropdownMenu/DropdownMenuPopover.tsx b/packages/bumbag/src/DropdownMenu/DropdownMenuPopover.tsx
@@ -31,6 +31,7 @@ const useProps = createHook<DropdownMenuPopoverProps>(
       items,
       setCurrentId,
       wrap,
+      unstable_disclosureRef,
       unstable_initialFocusRef,
       unstable_finalFocusRef,
       unstable_popoverRef,
@@ -65,6 +66,7 @@ const useProps = createHook<DropdownMenuPopoverProps>(
         items,
         setCurrentId,
         wrap,
+        unstable_disclosureRef,
         unstable_initialFocusRef,
         unstable_finalFocusRef,
         unstable_popoverRef,

diff --git a/packages/bumbag/src/DropdownMenu/index.ts b/packages/bumbag/src/DropdownMenu/index.ts
@@ -3,23 +3,20 @@ import { DropdownMenu as _DropdownMenu } from './DropdownMenu';
 import { DropdownMenuPopover } from './DropdownMenuPopover';
 import { DropdownMenuItem } from './DropdownMenuItem';
 import { DropdownMenuButton } from './DropdownMenuButton';
-import { DropdownMenuDisclosure } from './DropdownMenuDisclosure';
 import { DropdownMenuDivider } from './DropdownMenuDivider';
 import { DropdownMenuGroup } from './DropdownMenuGroup';
 import { useDropdownMenuState, DropdownMenuState } from './DropdownMenuState';
 
 export * from './DropdownMenu';
 export * from './DropdownMenuItem';
 export * from './DropdownMenuButton';
-export * from './DropdownMenuDisclosure';
 export * from './DropdownMenuPopover';
 export * from './DropdownMenuGroup';
 export * from './DropdownMenuDivider';
 export * from './DropdownMenuState';
 export const DropdownMenu = Object.assign(_DropdownMenu, {
   Popover: DropdownMenuPopover,
   Button: DropdownMenuButton,
-  Disclosure: DropdownMenuDisclosure,
   Item: DropdownMenuItem,
   Divider: DropdownMenuDivider,
   Group: DropdownMenuGroup,